Вопросы по CSS - [36] :: Web-программирование :: Компьютерный форум Ru.Board

Перейти из форума на сайт.

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в on-line?

Вход • Забыли пароль? • Первый раз на этом сайте? • Регистрация

Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS

Модерирует : Cheery
Версия для печати • Подписаться • Добавить в закладки
Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127

Открыть новую тему

Написать ответ в эту тему

Xrobak

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Ссылки для самостоятельного изучения:

Теория + примеры + учебники:
• W3School: CSS Tutorial
• MDN: Cascading Style Sheets (CSS)
• WebReference: Уроки по HTML и CSS
• htmlbook: Справочник CSS
• YouTube: Основы CSS/CSS3
• CSS для JavaScript-разработчика
• Основы CSS - каскадные таблицы стилей
• Статьи по основам CSS

Применение на практике:
• StackOverflow: 'CSS' Questions
• CSS-Tricks

Первый пост темы (до включения шапки).. ··· Текущий бэкап шапки..

Всего записей: 939 | Зарегистр. 16-08-2004 | Отправлено: 18:46 27-10-2004 | Исправлено: TheBarmaley, 05:24 27-02-2019

Alexey87

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:

в IE7 jsfiddle сам нормально не отображается

выкладываю код отдельно

Всего записей: 659 | Зарегистр. 27-01-2008 | Отправлено: 11:23 04-01-2015

anutti

Newbie

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

evoroz это слайдер без автопрокрутки, так что пользователь все успеет.

Цитата:

Формально, есть код первого слайда: <li><img src="images/image1.png" alt="image01" /></li> его и надо править, т.е. вместо картинки написать форму.

Это понятно, но если вставить туда поля формы то они не видны, потому что стили перекрываются - сам слайдет основан на inputах поэтому и проблема. пробовала приписывать им другой класс но все равно проблема не исчезла либо не видно форму либо не работает слайдер

Всего записей: 2 | Зарегистр. 04-01-2015 | Отправлено: 12:14 04-01-2015

Mavrikii

Platinum Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Alexey87

Цитата:

при наведении курсора на любой из пунктов выпадающего меню, меню скрывается

не вижу таких проблем в IE7
c выравниванием проблемы есть, но не с наведением. просто наводить нужно по цветному фону, а не произвольно.

Всего записей: 15176 | Зарегистр. 20-09-2014 | Отправлено: 00:39 05-01-2015

Alexey87

Advanced Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:

не вижу таких проблем в IE7

а у меня они есть
выкладываю видео

Всего записей: 659 | Зарегистр. 27-01-2008 | Отправлено: 01:13 07-01-2015

Junior Member

Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору

anutti

Цитата:

но если вставить туда поля формы то они не видны

На вскидку (если еще актуально

)... попробуйте форме задать:
position:absolute;
z-index:1000; #или меньше, если позволят уровни предыдущих слоев

Всего записей: 108 | Зарегистр. 09-10-2004 | Отправлено: 11:01 17-01-2015 | Исправлено: BABAYKA, 11:02 17-01-2015

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Кто может подсказать, как в CSS сделать границу того же блока картинкой, сверху и снизу? Просмотрел разные сайты, но везде в основном не то, что нужно. Для примера, как здесь, в виде гребёнки.

Всего записей: 3350 | Зарегистр. 30-06-2002 | Отправлено: 16:52 12-04-2015

Mavrikii

Platinum Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

WONDROUS
вставляете 2 дива с абсолютным позиционированием и нужным вам фоном.
один размещаете внизу, другой вверху.
можно только один, для второй границы использовать оригинальный див.

ps: пример - http://jsfiddle.net/x2b0m63u/1/

Код:

#centerblock {
position: relative;
}

div.border-top, div.border-bottom {
position: absolute;
height: 10px;
left: 0px;
right: 0px;
}

div.border-top {
top: 0px;
background: url(http://oi58.tinypic.com/2d6sf8j.jpg);
}

div.border-bottom {
bottom: 0px;
background: url(http://oi61.tinypic.com/rc1rhc.jpg);
}

и

Код:

<div class="bloc l-bloc" id="centerblock">
<div class='border-top'></div>
<div class='border-bottom'></div>
<div class="container bloc-lg">

----------
Если человека кусает вампир - он становится вампиром. Такое ощущение, что очень многих вокруг искусало ...

Всего записей: 15176 | Зарегистр. 20-09-2014 | Отправлено: 23:17 12-04-2015 | Исправлено: Mavrikii, 03:13 13-04-2015

OLEX

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

WONDROUS

Код:

<div class="block">
<div class="bg-top">
<div class="bg-bottom">
Текст
</div>
</div>
</div>

Код:

.block {background: #e2e2e2;}
.bg-top {background: url(http://i.imgur.com/axPPnbt.png) top repeat-x;}
.bg-bottom {background: url(http://i.imgur.com/Y2yllgy.png) bottom repeat-x; padding: 30px 15px;}

Живой пример - http://jsfiddle.net/olex/jwjuoa2d/

Всего записей: 3590 | Зарегистр. 09-07-2002 | Отправлено: 03:34 13-04-2015 | Исправлено: OLEX, 03:44 13-04-2015

Xrobak Advanced Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору на градиентах http://habrahabr.ru/post/176591/
	Всего записей: 939 \| Зарегистр. 16-08-2004 \| Отправлено: 13:44 13-04-2015

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Mavrikii
OLEX
Спасибо за ответ! Попробовал оба варианта, правда, немного на другом файле, но всё равно, в обоих вариантах получается отступ. Данная ширина отступа из кода Mavrikii.

А если здесь убрать padding, то этого бордюрчика вообще не видно:

Код:

.bg-bottom {background: url(http://i.imgur.com/Y2yllgy.png) bottom repeat-x; padding: 30px 15px;}

Всего записей: 3350 | Зарегистр. 30-06-2002 | Отправлено: 19:01 13-04-2015 | Исправлено: WONDROUS, 19:19 13-04-2015

WONDROUS Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору Вроде получилось кое-как. В html выглядит таким образом, нижний бордюр-картинку в самый низ вставил (ecFadeBottom1), после текста.
	Всего записей: 3350 \| Зарегистр. 30-06-2002 \| Отправлено: 21:30 13-04-2015

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Почему-то в Firefox не работает этот код, в остальных браузерах работает.

Код:

border: 3px dotted;

Пересмотрел несколько сайтов по CSS, но ничего не нашёл.

Всего записей: 3350 | Зарегистр. 30-06-2002 | Отправлено: 01:33 05-05-2015

Mavrikii Platinum Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору WONDROUS все работает - https://jsfiddle.net/kv3yeo7o/
	Всего записей: 15176 \| Зарегистр. 20-09-2014 \| Отправлено: 01:49 05-05-2015

OLEX Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору WONDROUS у меня работает: http://i.imgur.com/WZiflfw.png Живой пример - http://jsfiddle.net/olex/gffecq2q/
	Всего записей: 3590 \| Зарегистр. 09-07-2002 \| Отправлено: 04:21 05-05-2015

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Mavrikii
OLEX
В версии 24.8.0, не знаю, как в последних версиях, показывается так. Может, не так что делаю? Вот так в Сафари.

Добавлено:
Хотя для квадрата стиль работает, хоть пунктиром, хоть точками.

Всего записей: 3350 | Зарегистр. 30-06-2002 | Отправлено: 05:45 05-05-2015

Mavrikii

Platinum Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

WONDROUS

Цитата:

В версии 24.8.0

https://bugzilla.mozilla.org/show_bug.cgi?id=382721

Всего записей: 15176 | Зарегистр. 20-09-2014 | Отправлено: 06:57 05-05-2015

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Mavrikii
Спасибо за ссылку. Насколько понял по последнему сообщению на той странице, ни в одном из последующих обновлений они так и не исправили данный баг.

Всего записей: 3350 | Зарегистр. 30-06-2002 | Отправлено: 13:49 05-05-2015

OLEX Silver Member	Редактировать \| Профиль \| Сообщение \| Цитировать \| Сообщить модератору WONDROUS а чего ж 24, если уже 37 ??
	Всего записей: 3590 \| Зарегистр. 09-07-2002 \| Отправлено: 14:10 05-05-2015

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

OLEX
Версия 24 ESR устраивает, если в ней что-то косячит, то и в 37й версии часто то же самое. Да и новый интерфейс/тема не нравится, хоть и можно её настроить с помощью расширения.

Я так понимаю, что лучше стили для круглых картинок не делать вообще? или не обращать внимание на пользователей Фокса?

Всего записей: 3350 | Зарегистр. 30-06-2002 | Отправлено: 15:12 05-05-2015

OLEX

Silver Member

Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору

Цитата:

не обращать внимание на пользователей Фокса

ну это процентов 20 юзверей

Добавлено:
15% - http://gs.statcounter.com/#browser-RU-monthly-201501-201505-bar

Добавлено:
И тенденция к уменьшению

Всего записей: 3590 | Зарегистр. 09-07-2002 | Отправлено: 15:53 05-05-2015

Открыть новую тему

Написать ответ в эту тему

Страницы: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127

Компьютерный форум Ru.Board » Интернет » Web-программирование » Вопросы по CSS

Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC