Текст перекрывающихся элементов в выпадающих элементах - PullRequest
1 голос
/ 12 марта 2012

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

Я думал, что исправил это, добавив следующее в Div вокруг моего выпадающего списка.

position:relative; z-index:999999;

Дает мне

#source-programs-dd { overflow: auto; background: #fff; max-height: 198px; position:relative; z-index:999999;}

И это работает везде, кроме IE7. Есть идеи?

1 Ответ

1 голос
/ 12 марта 2012

Чтобы напрямую решить ваш вопрос, мне нужно увидеть ваш HTML и CSS.Но в целом IE7 имеет известную проблему с z-index и тем, как он вычисляет z-index для дочерних элементов.

Существует несколько вопросов Stackoverflow по этой проблеме.Вот некоторые из них, которые могут помочь:

Проблема Z-индекса IE7 - контекстное меню

расширение меню, отображаемого под галереей в IE7

Общая идея заключается в том, что в IE7 z-индекс рассчитывается для родительского элемента родных элементов.Это звучит немного странно, поэтому вот пример:

<div id="parent1">...</div>
<div id="parent2">...</div>

Если .parent1 имеет что-то вроде UL-меню, которое перекрывает .parent2, возможно, что .parent2 появится перед этим содержимым noнезависимо от того, какой z-индекс имеет любой дочерний элемент .parent1, .

Это связано с тем, что IE7 сравнивает z-индекс .parent1 и .parent2 и заставит все дочерние элементы наследовать свое значение в некотором смысле.,(Дочерние элементы фактически получают свой собственный контекст z-index, связанный друг с другом. Но потомки других родительских элементов в первую очередь зависят от своих родителей по отношению к дочерним элементам других родителей)

Решение состоит в том, чтобы найти 2элементы, которые вызывают проблему, и найдите, где они совместно используют родительские элементы, которые являются родственными элементами друг друга.

Затем примените надлежащий z-index к этим элементам.

.parent1{ z-index:10; }
.parent2{ z-index:1; }

Если вы публикуете свой HTMLЯ могу попытаться помочь найти вашу точную проблему.

Ура!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...