Выбирая переключатель перекрытия Строка меню Superfish

Строка меню представляет собой трехслойное меню суперфиша. Код для CSS панели меню есть: -Выбирая переключатель перекрытия Строка меню Superfish

/*** ESSENTIAL STYLES ***/ 
.sf-menu, .sf-menu * { 
    margin:   0; 
    padding:  0; 
    list-style:  none; 
} 
.sf-menu {line-height: 1.0;} 
.sf-menu ul { 
    position:  absolute; 
    top:   -999em; 
    width:   11em; /* left offset of submenus need to match (see below) */ 
} 
.sf-menu ul li {width:100%;} 
.sf-menu li:hover {visibility:inherit; /* fixes IE7 'sticky bug' */} 
.sf-menu li { 
    float:   left; 
    z-index:  9999;  #######Edited the Z-index here########## 
    position:  relative; 
} 
.sf-menu a {display:block;position: relative;} 
.sf-menu li:hover ul, 
.sf-menu li.sfHover ul { 
    left:   0; 
    top:   2.5em; /* match top ul list item height */ 
    z-index:  99; 
} 
ul.sf-menu li:hover li ul, 
ul.sf-menu li.sfHover li ul {top:-999em;} 
ul.sf-menu li li:hover ul, 
ul.sf-menu li li.sfHover ul {left:11em; /* match ul width */top:0;} 
ul.sf-menu li li:hover li ul, 
ul.sf-menu li li.sfHover li ul {top:-999em;} 
ul.sf-menu li li li:hover ul, 
ul.sf-menu li li li.sfHover ul {left:10em; /* match ul width */top: 0;} 

/*** DEMO SKIN ***/ 
.sf-menu {float:left;margin-bottom: 1em;} 
.sf-menu ul {box-shadow: 2px 2px 6px rgba(0,0,0,.2);} 
.sf-menu a { 
    border-left: 1px solid #fff; 
    border-top:  1px solid #CFDEFF; 
    padding:  .75em 1em; 
    text-decoration:none; 
} 
.sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/ 
    color:   #13a; 
} 
.sf-menu li {background:#BDD2FF;} 
.sf-menu li li {background:#AABDE6;} 
.sf-menu li li li {background:#9AAEDB;} 
.sf-menu li:hover, .sf-menu li.sfHover, 
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active { 
    background:  #CFDEFF; 
    outline:  0; 
}

Html код для выбора коробки: -

<select name="designation" id="designation" class=forCombobox> 
<option value="">--Select--</option> 
</select>

CSS для forCombobox: -

.forCombobox 
{ 
    font-family: Verdana; 
    font-size: 11px; 
    color: #000000; 
    z-index:-1; 
    border: 1px outset; 
    border-color:#58585A; 
}

У меня есть установите Z-индекс как 9999 ... все же строка меню перекрывает поле выбора. И в окне выбора нет набора Z-индексов. Что делать ...?

источник

2013-03-08 rams

комплект Z-index = 0; для выбора поля –

Просьба предоставить jsFiddle – Nobita

@rams Если у вашего Selectbox есть опция класса или стиля, тогда поставьте Z-Index = -1 или 0 (Nayana Adassuriya уже сказал) в противном случае Пожалуйста, отправьте некоторый код HTML – snowp

От w3schools.com:

Z-индекс свойство определяет порядок стека элемента.

Элемент с большим порядком стека всегда находится перед элементом с более низким порядком стека.

Примечание: z-индекс работает только с расположенными элементами (положение: абсолютное, положение: относительное или положение: фиксированное).

источник

2013-03-08 10:15:09 Morpheus

http://w3fools.com/ (дружеское напоминание) – Nobita

Я знаю :), но это объяснение хорошее :) – Morpheus

Если вы согласны с этим, Все лучше избегать ссылок на w3schools вообще. Тем не менее, ваш ответ полностью в порядке, на самом деле вы получили мое возвышение. ;-) – Nobita

Выбирая переключатель перекрытия Строка меню Superfish

ответ

Смежные вопросы