Совершенству эволюция не нужна.
Привет, народ. Может быть попробуем разобраться с z-indexами?
Вот например делаю дизайн, суть в том, что page-c "наползает" на extratop, на котором расположена сложная картинка, часть которой должна перекрываться текстом из эпиграфа и ссылками меню, а часть - собственно картинкой и остается. Это я сделал. Теперь мне нужно, чтобы фон page-t располагался ПОД картинкой экстратопа, а ссылки из эпиграфа - НАД картинкой. Делаю для page-t z-index: -1, в то время как индекс экстратопа 1, и ничего не происходит. Добавляю z-index: -1 для page-c, и эти блоки убираются под экстратоп. Теперь задача в том, чтобы сделать эпиграф НАД экстратопом, я прописываю #epigraph и #post0 {z-index: 10 !important;} и почему-то ничего не меняется, блоки всё равно находятся под топом, хотя z-index для page-c и page-t не имеет тега !important.
Возможен ли вообще мой вариант развития событий, как решить проблему и вообще, может быть отдельное мини-руководство по z-indexам для дайри написать?))
Внезапно код:
читать дальше
Вот например делаю дизайн, суть в том, что page-c "наползает" на extratop, на котором расположена сложная картинка, часть которой должна перекрываться текстом из эпиграфа и ссылками меню, а часть - собственно картинкой и остается. Это я сделал. Теперь мне нужно, чтобы фон page-t располагался ПОД картинкой экстратопа, а ссылки из эпиграфа - НАД картинкой. Делаю для page-t z-index: -1, в то время как индекс экстратопа 1, и ничего не происходит. Добавляю z-index: -1 для page-c, и эти блоки убираются под экстратоп. Теперь задача в том, чтобы сделать эпиграф НАД экстратопом, я прописываю #epigraph и #post0 {z-index: 10 !important;} и почему-то ничего не меняется, блоки всё равно находятся под топом, хотя z-index для page-c и page-t не имеет тега !important.
Возможен ли вообще мой вариант развития событий, как решить проблему и вообще, может быть отдельное мини-руководство по z-indexам для дайри написать?))
Внезапно код:
читать дальше
-
-
22.08.2010 в 08:16-
-
22.08.2010 в 08:24Ну, оно как-то всё равно не помогает. Сделал я для эпиграфа и пост0 позицию абсолютную, а они все равно под экстратопом, в то время как есть там еще #add_block, для него отрицательный з-индекс сработал и он располагается там где нужно.
-
-
22.08.2010 в 08:37Проставь везде точки с запятой, где они должны быть. И не используй отрицательные z-index, их не все браузеры правильно понимают.
И еще - покажи макет, как должно получиться, а то я после четырех часов сна мало что поняла из описания
-
-
22.08.2010 в 08:52Странно что отрицательный индекс, который я поставил для аддблока, как раз сработал. Изначально ведь аддблоки располагаются поверх экстратопа, это проверено уже. А у меня с отрицательным индексом он уходит под топ, в то время как положительный индекс для эпиграфа не срабатывает. Тут видимо влияет хитросплетение элементов, потому что я другой причины не вижу. Консоль выдает, что индекс page-c, родительского элемента, не влияет на эпиграф, тогда почему не работает?
Вот то, что сейчас творится - s61.radikal.ru/i173/1008/75/3d5315e2a669.jpg страшно да? Это не для меня дизайн, так что сильно не пугайся))
Картинка справа - экстратоп, под ним располагается горизонтальный бордюр через всю страницу - аддблок. Вертикальный бордюр - фон page-t, тут он тоже уходит под топ как мне и нужно. Эпиграф понятно где, там он тоже под топ уходит, хотя индекс у него 10..
-
-
22.08.2010 в 08:59-
-
22.08.2010 в 08:59-
-
22.08.2010 в 09:02И ничего страшного, требующего z-index, не вижу. Куда смотреть? Текст эпиграфа уезжает под картинку - так это все лучше пэддингами отрегулировать, чем сверху наслаивать.
-
-
22.08.2010 в 09:09Так в том и дело, что отрегулируешь его, а ссылки-то не работают)) они перекрываются экстратопом, у которого фон не цельная картинка, а вот площадь-то его - прямоугольник, который и перекрывает собой ссылки, так что ничего потом не нажимается.
У меня есть идея обойти вопрос тем, что отрезать нижнюю часть картинки топа и сделать ее как фон другого элемента, но тогда я потеряю возможность поставить туда другой более полезный фон.
-
-
22.08.2010 в 09:11-
-
22.08.2010 в 10:49Нет, в эпиграфе. Меню кстати отрабатывает корректно О.о
-
-
22.08.2010 в 11:25z-index хорошо работает только для сестринских элементов, имеющих одного непосредственного родителя в html. (например, для extratop, page-c, side, extrabottom будет работать хорошо, все они лежат во wrapper, а add_block1 и epigraph между ними вряд ли встанут)
в IE, z-index задает контекст, который вообще не может пересекаться с другими контекстами, какие ни задаыай z-index-ы внутренним элементам, увы.
значения меньше 1 могут работать, но их не стоит использовать из-за очень разной поддержки браузерами.
как правило, задачу можно упростить
можешь дать ссылочку на живую проблему?
-
-
22.08.2010 в 11:39Мне нужно, чтобы он лежал на картинке) У человека, которому я дизайн делаю, там ссылки, которые не активны, если лежат под экстратопом. А вот ссылку дать не могу по причине того,что этот диз на моем дневнике как дополнительный, а устанавливать его себе на постоянное пользование я не буду по известным причинам)) Сейчас еще поразбираюсь, попробую, а если не получится, создам дневник с тестовыми деньгами и поставлю диз туда, а ссылку кину по умайлу.
-
-
22.08.2010 в 12:55Разрежу картинку на аддблоки с разными индексами, да и дело с концом))
-
-
22.08.2010 в 13:00-
-
22.08.2010 в 13:08Я знаю, но у меня на такую ссылку получалось только непосредственно под своим логином входить О.о
-
-
22.08.2010 в 13:12Только надо заходить под адресом своего журнала. Например, для тебя будет так: pay.diary.ru/~RoldoTheUndying/?design=3565283&n...
А дизайн не твой)).
-
-
22.08.2010 в 13:14А) Ну тогда понятно, но я уже там переделываю все, так что нет смысла наверное ссылку давать..
-
-
22.08.2010 в 13:20Хоть на будущее будешь знать).