|
|
Вот еще пример неожиданного нарушения области владения parent-child, но уже на уровне иерархии контейнеров.
Контейнер с фоновым изображением One содержит в себе таблицу, которая содержит второй контейнер с вложенным изображением имеющим z-index -1. Мы ожидаем, что все, что расположено над фоном, мы должны видеть незавимимо от назначенного z-index, потому что мы делаем различные назначения z-index -1 вложенным дочерним элементам. Как бы не так! На самом деле фон нижнего контейнера в FireFox и Opera может рисоваться сверху вложенных в него других контейнеров.Вопрос:
Ситуация разрешается очень просто, если иметь ввиду, что в Opera и FireFox нельзя применять отрицательные индексы. По крайней мере для значимых элементов.
Интересно, что в Opera и FireFox прозрачные фоны точно так же заслоняют изображения, как и непрозрачные. Обычно это обнаруживается, когда какие-нибудь активные элементы, например, ссылки, перестают работать. В сложном макете с множеством слоев 100%-й высоты бывает непросто найти, какой именно прозрачный слой закрывает содержание. Если для слоев используются имена классов, можно прощупать страницу, добавив ко всем подозрительным слоям такой код:
onclick="alert(this.className)"
Тогда при нажатии на невидимый слой вы узнаете имя его стилевого класса.