Проблема со слоями в CSS
От: kid_mag  
Дата: 26.05.05 07:34
Оценка:
Сделал на сайте динамическое меню с использованием CSS, которе взял из статьи Динамическое выпадающие меню для IE без использования скриптов JavaScript с сайта realcoding.net.
Но, возникла проблема с перектытием слоев. Меню первого уровня находится НАД подменю.
Вот код, используемый в style.css
div#menu {
   font: 10px Verdana, sans-serif;
   height: 15px;
   white-space: nowrap;
   width: 100%;
   position: relative;
   z-index:1;
}

div#menu .a {
   display: inline;
   position: absolute;
   z-index: -1;
   text-decoration: none;
   clip: auto;
}

div#menu .a table {
   position: absolute;
   display: block;
   font: 10px Verdana, sans-serif;
   z-index: 10;
               }

div#menu table, div#menu table a {
   display: none;
}
div#menu .a:hover{
   text-decoration: underline;
   margin-right:0px;

}

div#menu div.menuitem:hover {
   text-decoration: underline;
   margin-right:0px;
   z-index:1;

}

div#menu .a:hover table, div#menu div.menuitem:hover table{
   background: #FFFFFF;
   border: 1px solid #708090;
   display: list-item;
   white-space: nowrap;
   position:relative;
   z-index:1;
}

div#menu .a:hover table a, div#menu div.menuitem:hover table a {
   color: #000000;
   display: block;
   padding: 1px 12px;
   text-decoration: none;
   white-space: nowrap;
   z-index:2;
   position:relative;


}

div#menu .a:hover table a:hover, div#menu div.menuitem:hover table a:hover {
   background: #7DA6EE;
   border: 1px solid #000000;
   color: #000000;
   display: block;
   padding: 0px 12px;
   text-decoration: none;
   position:relative;
   z-index:2;
}

td {
   border-width: 0px;
   padding: 0px 0px 0px 0px;
}
.menuitem {
   float: left;
   margin: 1px 1px 1px 1px;
   padding: 1px 1px 1px 1px;
}

.menuitem * {
   padding: 0px 0px 0px 0px;
}
#other {
  height: auto;visibility: visible;
}
#moz{
  height: 1px;visibility: hidden;
}
#moz::-moz-cell-content{
  height: auto; visibility: visible;
}
#other::-moz-cell-content{
  height: 1px; visibility: hidden;
}
#holder {
  width: 100%;
}


Помогите разобраться, найти ошибку.
 
Подождите ...
Wait...
Пока на собственное сообщение не было ответов, его можно удалить.