IE8, XHTML, положение: исправлено; и Z-индекс - PullRequest
Новая
       28

IE8, XHTML, положение: исправлено; и Z-индекс

0 голосов
/ 02 июня 2010

У меня есть XHTML 1.0 переходный Doctype.

У меня есть <div>, то есть position: fixed; bottom: 0px; left: 0px; width: 100%; z-index: 200;.

Внутри этого <div> у меня есть две кнопки, которые расположены относительно друг друга и выровнены по правому краю с установленным z-индексом 201;

В Firefox панель внизу и две кнопки правильно расположены внизу.

Однако в IE8 полоса видна, и z-индекс, по-видимому, перекрывает другое содержимое, но кнопки скрыты за основным div, несмотря на то, что они дочерние и имеют установленный z-индекс.

Я использую следующий метатег; <meta http-equiv="X-UA-Compatible" content="IE=edge" /> чтобы заставить документ в режиме IE8.

Если я эмулирую IE7 (включаю режим совместимости), панель и кнопки работают просто отлично. Я не понимаю, как рендеринг IE7 лучше, чем IE8. Я не хочу использовать режим совместимости из-за других вещей, которые IE7 не может отрисовать, а IE8 может. Есть другое решение или я что-то пропустил?

Спасибо.

Ответы [ 2 ]

2 голосов
/ 02 июня 2010

Я решил проблему, вынув кнопки из контейнера / бара и расположив их по своему усмотрению. Работает в IE7, IE8, Firefox - Chrome не нравится делать 100% на позиции: исправлено; бар. Проклятье.

1 голос
/ 02 июня 2010

http://brenelz.com/blog/squish-the-internet-explorer-z-index-bug/

попробуйте присвоить родительскому элементу более высокий номер z-index (он предполагает, что у вас есть отдельная таблица стилей для ie, хотя)

Кроме того, попробуйте использовать этот тип документа, чтобы перевести рендеринг в режим совместимости с стандартом ie8, а не с помощью edge (что означает, что вы всегда получаете самую последнюю версию)

подробнее здесь: http://www.alistapart.com/articles/beyonddoctype

«Это потому, что даже Эрик Мейер не может предсказать ошибки макета или сценариев, которые могут случайно появиться в новой версии браузера».

...