IE7 Z-индексных проблемы разделения на уровни
еще, все еще скептически настроенный; как большинство продуктов Microsoft, я ожидаю SP2 или полтора года прежде, чем доверять им производственной среде
и отмечаю, что в значительной степени каждая новая вещь, представленная любым, не только Microsoft, провозглашена, поскольку "легкий вес, быстрый и легкий" - берет его с блоком соли. Они не рекламируют проблемы/проблемы вполне так же громко как преимущества/функции! Вот почему мы ожидаем ранних последователей для обнаружения их.
Это не должно осуждать ORM или LINQ или что-либо как этот; я резервирую решение до
- , у меня есть время для оценки их,
- , некоторая потребность возникает, который только они могут удовлетворить,
- , технология кажется стабильной и хорошо поддерживаемой достаточно для риска в одной из продуктивных сред моих клиентов, и/или
- , клиент запрашивает это
, отметьте: я сделал ORM прежде, вручную, и он работал просто великолепно, таким образом, у меня есть большие надежды на более новые системы ORM.
3 ответа
Z-индекс не является абсолютным измерением. Элемент с z-index: 1000 может находиться за элементом с z-index: 1 - до тех пор, пока соответствующие элементы принадлежат разным контекстам наложения .
] Когда вы указываете z-index, вы указываете его относительно других элементов в том же контексте стекирования, и хотя спецификация CSS ' В параграфе Z-index говорится, что новый контекст наложения создается только для позиционированного контента с z-индексом, отличным от auto (то есть весь ваш документ должен быть одним контекстом наложения), вы действительно построил позиционируемый диапазон: к сожалению, IE7 интерпретирует позиционированный контент без z-index this как новый контекст наложения.
Короче говоря, попробуйте добавить этот CSS:
#envelope-1 {position:relative; z-index:1;}
или измените дизайн документа так, чтобы ваши промежутки не ' t иметь position: relative больше:
<html>
<head>
<title>Z-Index IE7 Test</title>
<style type="text/css">
ul {
background-color: #f00;
z-index: 1000;
position: absolute;
width: 150px;
}
</style>
</head>
<body>
<div>
<label>Input #1:</label> <input><br>
<ul><li>item<li>item<li>item<li>item</ul>
</div>
<div>
<label>Input #2:</label> <input>
</div>
</body>
</html>
См. http://www.brenelz.com/blog/2009/02/03/squish-the-internet-explorer-z-index-bug/ для аналогичного примера этой ошибки. Причина, по которой для родительского элемента (envelope-1 в вашем примере) более высокий z-index работает, заключается в том, что тогда все дочерние элементы envelope-1 (включая меню) будут перекрывать всех братьев и сестер envelope-1 (в частности, envelope-2).
Хотя z-index позволяет вам явно определять, как элементы перекрываются, даже без z-index порядок слоев четко определен . Наконец, в IE6 есть дополнительная ошибка, из-за которой поля выбора и окна iframe размещаются поверх всего остального.
В IE6 в целом определенные элементы пользовательского интерфейса реализованы с помощью собственных элементов управления. Эти элементы управления отображаются в совершенно отдельной фазе (окно?) И всегда отображаются над любыми другими элементами управления, независимо от z-индекса. Поля выбора - еще один такой проблемный элемент управления.
Единственный способ обойти эту проблему - создать контент, который IE отображает как отдельное «окно», то есть вы можете разместить поле выбора над текстовым полем или, что более полезно, iframe.
Короче говоря, вам нужно будет поместить такие элементы, как меню, в iframe, чтобы позволить IE разместить эти встроенные элементы управления пользовательского интерфейса.
Это должно было быть исправлено в IE7 (см. http://blogs.msdn.com/ie/archive/2006/01/17/514076.aspx ), но, возможно, вы работаете в каком-то режиме совместимости?
Эта ошибка кажется отдельной проблемой, чем стандартная ошибка IE с отдельным контекстом стека. У меня была аналогичная проблема с несколькими сложенными входами (по сути, таблица с автозаполнением в каждой строке). Единственное решение, которое я нашел, - это присвоить каждой ячейке уменьшающееся значение z-index.