Обойти две ошибки макета IE6
Моя веб-страница страдает двумя ошибками рендеринга IE6. У каждого из них есть обходные пути, но, к сожалению, указанные обходные пути несовместимы друг с другом.
Вот минимизированный тестовый пример. Поведение в Firefox / Safari - желаемое / правильное. IE7 неизвестен, так как у меня сейчас нет к нему доступа.
Первая ошибка: #content имеет overflow: auto и содержит относительно позиционированный div. IE6 неправильно придает относительному позиционированию div "фиксированный" вид. Обходной путь: установить позицию: относительно #content.
Вторая ошибка: на странице иногда отображается модальное всплывающее окно. Z-index во всплывающем окне и на фоне установлены очень высокими, чтобы предотвратить взаимодействие с чем-либо, находящимся за ними. Это работает нормально, пока я не установлю position: relative на #content, что делает IE6 обрабатывать свойство z-index совершенно неправильно.
Как я могу заставить эти ошибки хорошо взаимодействовать друг с другом? (Примечание: удаленное форматирование жестких дисков пользователей, все еще работающих с IE6, не вариант, к моему большому разочарованию.)
Редактировать:Вот второй тестовый пример, который показывает, что происходит, когда я применяю позицию: относительно содержимого. Первая ошибка («исправленное» появление # content-header) решена, но она приводит к срабатыванию ошибки z-index и нарушению модального фона.
Ответы 4
Хотя это может быть неправильное решение и, вероятно, излишнее, jQuery может создавать модальные всплывающие окна, подобные этому, и работает в IE6. Я, вероятно, получу отрицательный ответ за такой простой ответ, но все же стоит рассмотреть или, по крайней мере, взглянуть на другие решения, прежде чем изобретать колесо.
К сожалению, я застрял в использовании ASP.NET ModalPopupExtender, поскольку на странице есть некоторые серверные элементы управления, которые необходимо запустить. Возможность делать все в jQuery значительно упростит задачу! :(
Существует множество способов избежать серьезных проблем с соответствием ie6 (и ниже). Единственное, что действительно сработало для меня (даже в значительной степени), - это решение Дина Эдварда.
Попробуйте вставить в основной заголовок следующую строку:
<!--[if lt IE 8]><script src = "http://ie7-js.googlecode.com/svn/version/2.0(beta)/IE7.js" type = "text/javascript"></script><![endif]-->
- и посмотрите, как это будет дальше (и что вам еще нужно сделать, поскольку это, вероятно, не все исправит).
Размер скрипта составляет всего 30 КБ, и он будет загружен только в ie6 и ie7.
URL-адрес кода Google (очевидно) http://code.google.com/p/ie7-js/
Реализуйте что-то вроде того, что мы сделали на Ra-Ajax.org (подсказка, посетите сайт с IE;)
Серьезно, сейчас даже prototype.js и 37signals ПРЕКРАТИТ поддержку IE6, думаю, пора двигаться дальше ...
Это вне моего контроля. Я создаю приложение интрасети для организации, которая в настоящее время стандартизирована для IE6 (из-за того, что у них есть ДРУГИЕ приложения интрасети, которые не работают ни в чем, кроме IE6). Мне действительно нравится то, что вы там сделали, но я бы хотел, чтобы мне заплатили за свою работу. знак равно
Я не думаю, что использование библиотеки - это слишком плохо, чтобы свести к минимуму мое время работы над нелепыми ошибками IE.
В итоге мы использовали плагин jquery bgiframe (http://plugins.jquery.com/project/bgiframe). Он реализует технику «щита» iframe в библиотеке. Я полагаю, что заставляя пользователей IE6 иметь немного больше штрафа за загрузку библиотеки (что на самом деле не так уж и много), чтобы мне не приходилось сходить с ума по IE6 bleedthru, оно того стоит.
P.S. Я думаю, что мировые веб-разработчики должны подать коллективный иск, чтобы заставить Microsoft ether предложить эквивалент firebug для IE6 и IE7, убедиться, что все экземпляры IE6 и IE7 обновлены до стандартов, или удалить все версии IE6 и IE7 из все компьютеры в Интернете, или спасите всех веб-разработчиков с выплатой по 1 миллион долларов каждому за их боль и страдания!
К вашему сведению, First Bug отображается в IE7 так же, как и в FF3 в Windows. Не удалось проверить вторую ссылку ошибка, так как наш брандмауэр классифицируя сайт как «порнография»: P