z-index и ИЕ7

[RoleXXX]

Столкнулся с такой проблемой, что ИЕ не может опустить потомка под родителя. Например есть блок с z-index:1, внутри которого лежит position:absolute; z-index:-500. Все броузеры актуальных версий это отображают корректно, но ИЕ не может поставить -500 под 1. Это как-то лечится?

[Searcher]

с точки зрения логики это неверно...

правильно будет разместить два независимых блока с общим родителем друг под другом

[RoleXXX]

Спасибо. Но меня интересует как хакнуть этот баг в ИЕ, а не альтернативная вёрстка. К тому же в моём случае альтернативных вариантов нет. Есть только один вариант: запихнуть потомка под родителя. И ничего неверного я в этом не вижу, потому что абсолютный блок изымается из потока документа и может находится где угодно независимо от других элементов страницы.

Edited April 17, 2009 by RoleXXX

[Justnewone]

Спасибо. Но меня интересует как хакнуть этот баг в ИЕ, а не альтернативная вёрстка. К тому же в моём случае альтернативных вариантов нет. Есть только один вариант: запихнуть потомка под родителя. И ничего неверного я в этом не вижу, потому что абсолютный блок изымается из потока документа и может находится где угодно независимо от других элементов страницы.

Почитайте где-неть про связку релейтив с абсолютом и про z-index, у кого там какой приоритет по спецификации... может даже найдете что-то неверное.

[Searcher]

...И ничего неверного я в этом не вижу, потому что абсолютный блок изымается из потока документа и может находится где угодно независимо от других элементов страницы.

Ага, если родитель имеет position:relative или position:absolute, то и дочерние абсолютные блоки позиционируются относительно родителя, а не относительно всего документа... Так что изымаются из потока они тоже не абсолютно И надо смотреть на общую логику: как вы себе представляете матрешку, когда вложенная фигурка будет находится под фигуркой в которую она вложена?

Спасибо. Но меня интересует как хакнуть этот баг в ИЕ, а не альтернативная вёрстка. К тому же в моём случае альтернативных вариантов нет. Есть только один вариант: запихнуть потомка под родителя...

И что же это за ситуация такая, когда невозможно найти альтернативу? Расскажите подробней о проблеме, может мы вместе все-таки найдем альтернативу...

[RoleXXX]

Ситуация с футером, который должен быть всегда внизу страницы. Плюс внизу же должен быть градиент...

Впрочем ситуацию удалось разрешить. Просто добавил после футера еще один блок с отрицательным z-index, вставил в него градиент с отрицательным top (иначе опера оставляла внизу страницы место под него) и поднял этот блок под футер (и под всё остальное) отрицательным margin-top.

ЗЫ. отрицательные маргины рулят! :-)

ЗЫЫ. Дык получается что прав ИЕ, а все остальные броузеры косячат с z-index?

[Searcher]

вот неплохая реализация футера внизу страницы

а градиент внизу можно и на body повесить, а если body уже занят - позиционировать блок с этим градиентом абсолютно и описать его не в конце кода, а в начале и чтобы родитель у него был body.

[RoleXXX]

Та реализация немного излишне сложновата. И не будет работать в опере. Потому что опере нужно height:auto!important. Вроде бы так.

body говорите? а вы пробовали? В обоих описанных вами случаях градиент отбражается внизу окна, а не внизу страницы. И если контента много, то градиент скроллится вверх вместе с контентом. Его можно положить только в блок у которого height:auto!important; min-height:100%, то есть высота на 100%. Или в блок, следующий за ним (футер) и поднять отрицательным margin-top. Ну или в блок, следующий за футером :-) как сделал я, потому что у меня градиент на всю ширину, а футер узкий центрированный.

Edited April 17, 2009 by RoleXXX

[Searcher]

Если бы вы дали код, было бы все понятнее и я попробовал бы, а так на пальцах не всегда все можно себе представить так как вы хотели бы.

[Nekromancer]

ЗЫЫ. Дык получается что прав ИЕ, а все остальные броузеры косячат с z-index?

сильно сомневаюсь.. "косячить" это привилегия IE..

[SelenIT]

IE неправ. Вот подробнее об этом баге. Кстати, в IE8 его исправили.

[Nekromancer]

решение?

1. Убрать position:relative для .entry

2. Задавать разные z-index для .entry. В случае новостей это невозможно, они ведь генерируются симметрично. Однако когда у нас header и content, вполне подходит.

вполне логичное решение, даже без прочтения статьи..