У меня странная проблема в IE7 (я имею в виду режим совместимости с IE8), где полосы прокрутки в div
отображаются за его содержимым. Он находится в модальном диалоговом окне jQueryUI, которое занимает большую часть экрана и содержит много материала. Div содержит ASP:Repeater
, который отображает настроенные строки в макете в стиле сетки.
Полная разметка для div это:
<div style='max-height:250px; overflow-y:scroll;
border:1px solid #AAAAAA; border-top-width:0; margin-left:auto;
margin-right:auto;'>
<asp:Repeater ID="myRepeater" runat="server">
<ItemTemplate>
<asp:Panel ID="pnlItem" runat="server" style='padding-top:5px;
padding-bottom:5px; position:relative;'>
.....
</asp:Panel>
</ItemTemplate>
</asp:Repeater>
</div>
Вот скриншот проблемы. Серый цвет, закрывающий вертикальную полосу прокрутки, - это чередующийся цвет фона, установленный через класс на pnlItem
. Текст ниже («H.S. Gym») является частью нижней части pnlItem
в повторителе. Кроме того, когда я перемещаю одну из полос прокрутки, содержимое не перемещается, пока я не переместлю модальное диалоговое окно.
Я не знаю, что здесь делать. Это похоже на действительно случайную ошибку рендеринга, которая будет иметь такое же случайное решение. Гугл не помог. Что здесь происходит?
РЕДАКТИРОВАТЬ 07.10.2011: Я решил проблему перекрывающихся полос прокрутки, установив явную ширину в div. Теперь вертикальная полоса прокрутки отображается правильно в IE7, но когда я использую ее для прокрутки, позиция прокрутки контента не обновляется, пока я не возьму модальный за строку заголовка и не переместлю его в экран браузера. Я обновил заголовок этого вопроса, чтобы отразить это.