CSS z-index не работает в IE7 - PullRequest
Новая
       38

CSS z-index не работает в IE7

0 голосов
/ 20 августа 2010

Я знаю о проблеме z-index в IE7, но у меня здесь странная ситуация, и ни одно из исправлений, предложенных онлайн, похоже, не работает.У меня есть список элементов, каждый из которых имеет всплывающий пузырьковый элемент div внутри тега "li", например: 

<div class="inner">
  <ul>
    <li onmouseover="bubbleOn(5661)" onmouseout="bubbleOff(5661)" id="c5661">
      <img src="/images/new/simple-dot-brown.gif" class="coloredDot" />
      Asthma, 
      <small id="year5661">1974</small> 
      <div class="mouseover-bubble orange" id="bubble_5661" style="display:none;"> 
        <h6>Asthma</h6> 
        <div class="definition">                               
          <p>A form of bronchial disorder....</p>
        </div>
      </div>
    </li>
  </ul>
</div>

Вот соответствующий CSS: 

div.mouseover-bubble {
  position: absolute;
  width: 360px;
  left: 10px;
  bottom: 10px;
  z-index: 10000; 
}

Пока я оставляю CSS так, как получил, всплывающее окно работает нормально.Но меня попросили переместить всплывающие элементы div ниже соответствующего «li», а не над ним.Если я изменю строку «bottom: 10px» на «top: 10px», то внезапно в IE7 произойдет сбой z-index, и я смогу увидеть информацию, которая должна быть скрыта под всплывающим div.У кого-нибудь есть идеи, почему это произойдет?Большинство материалов по z-index в IE7, которые я нахожу, говорят о позиционировании, но я не изменяю позиционирование CSS, просто переключаю «bottom» на «top».

1 Ответ

0 голосов
/ 20 августа 2010

У меня возникла та же проблема в этот день ... вам придется поместить элемент в position:relative

Другой способ сделать это - установить z-индекс родителя на что-то более высокое ...

не спрашивайте меня, почему ... но это работает

РЕДАКТИРОВАТЬ извините .. я только что видел, что вы не можете изменить положение на относительное ... попробуйте второйвариант и дайте мне знать, что работает

...