родительская проблема zIndex IE6 и IE7 - PullRequest
Новая
       22

родительская проблема zIndex IE6 и IE7

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

Для моего понимания.Мне нужно поместить div 2 перед div 3. Как я могу сделать это в IE6 и IE7.Все остальные браузеры работают нормально.Вот мой код

Ответы [ 3 ]

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

Я проверил следующее в IE6 / 7/8, Chrome и Firefox.Это ставит #two между #one и #three

HTML: 

<html lang="en">
  <head>
    <title>Test</title>
  </head>
  <body>
    <div id="content">
       <div id="one">One</div>
       <div id="two">Two</div>
       <div id="three">Three</div>
    </div>
  </body>
 </html>

CSS: 

 #one{
     background-color: #f1f1f1;
     position: absolute;
     left:105px;
     top:155px;
     z-index: 0;
 }
 #two{
     background-color: #c9c9c9;
     position: absolute;
     left:100px;
     top:145px;
     z-index: 1;
 }
 #three{
       background-color: #888888;
       color: #f1f1f1;
       position: absolute;
       left:95px;
       top:135px;
       z-index: 2;
 }

В действии: http://www.webdevout.net/test?02C

0 голосов
/ 19 мая 2011

Насколько мне известно, решения этой проблемы не существует, поскольку # div1 автоматически получает "z-index: 0" в IE7, что предотвращает перекрытие # div2 # div3.

Чтобы FF и Chrome вели себя как IE7, добавьте «z-index: 0» ко всем элементам без указания «z-index».Это не решит вашу проблему, но может облегчить тестирование.

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

См. Ошибка z-index в Internet Explorer? .

Вам необходимо явно установить z-index для вашего "#div1". Просто установите #div1 { z-index: 0; } и ваша проблема решена.

http://www.webdevout.net/test?01c

...