Z-index vs Доступность

Question

Вот упрощение моего кода, с которым у меня возникают проблемы, относительно расслоения.

<ul id="main_menu"> 
    <li>Option 1 
     <ul id="submenu1"> 
      <li>link</li> 
      <li>link</li>     
      <li>link</li> 
     </ul> 
    </li> 
    <li>Option 2 
     <ul id="submenu2"> 
      <li>link</li> 
      <li>link</li>     
      <li>link</li> 
     </ul> 
    </li> 
</ul> 

Моя проблема заключается в том, что submenu2, кажется, выше Вариант 1. Я попытался дать им соответствующие Z-индексы, но они, кажется, не работает ... Я предполагаю, потому что submenu2 ребенок Вариант 2 и не имеет отношения к Варианту 1.

Любая идея любой работы вокруг этого поможет решить мою проблему?

Я использую большую графику для большинства этих ссылок, поэтому перекрытие является довольно очевидным.

Answer 1

z-index работает только с абсолютно позиционируемыми элементами. И, как отмечают мои комментаторы, относительное и фиксированное позиционирование. Я несколько поспешил сказать, что элемент должен быть вырван из обычного потока документов.

Answer 2

Трудно сказать, не видя CSS, но для того, чтобы z-index работал правильно, элемент должен располагаться либо абсолютно, относительно, либо фиксирован.