2013-09-28 2 views
0

У меня есть неупорядоченный список в абсолютно позиционированном div. Я пытаюсь сделать эффект зависания на отдельных элементах li, и он просто не работает. Курсор только запускает эффект наведения, когда он немного выше текста ли.Как сделать UL LI в абсолютно позиционированном контейнере правильно?

Это самый широкий сегмент адаптивного макета дизайна, и наведение работает очень хорошо до самого широкого состояния, когда для задач проектирования я должен переключить содержащий div на абсолютное положение, и я провел много экспериментов и всегда работает без абсолютное позиционирование, но я просто не могу правильно расположить свой контейнер в конечном состоянии, удалив его из потока.

Этот человек заводит меня орехами, где я иду неправильно?

.secondary_header{ 
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7); 
    position:absolute; 
    width:700px; 
    border-bottom-right-radius:60px; 
    height:60px; 
} 

.secondary_header ul{ 
    margin:0 auto; 
    width:100%; 
} 

.secondary_header ul li{ 
    background-image:url(../images/audio_icon.png); 
    background-repeat:no-repeat; 
    background-position:0px; 
    padding-left:50px; 
    float:left; 
    list-style:none; 
    line-height:60px; 
    padding-left:50px; 
    height:60px; 

} 

.secondary_header ul li:hover{ 
    color:#09F; 
} 
+0

Вы также можете отправить код jsfiddle или html? –

+0

, пожалуйста, напишите больше кода или скрипки, похоже, проблема в другом месте – otherDewi

+0

Я изменил z-индекс div вторичного_header и проблема была решена. Не уверен, что делать, чтобы вопрос стал более полезным! – absentx

ответ

0

Информация, предоставленная вами, недостаточна. Если следующий код соответствует вашему требованию, тогда будьте счастливы или еще ... уточните свое требование, чтобы у меня была хорошая идея.

.secondary_header{ 
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7); 
    position:absolute; 
    width:700px; 
    border-bottom-right-radius:60px; 
    height:60px; 
} 

.secondary_header ul{ 
    margin:0; 
    padding:0px; 
    width:100%; 
} 

.secondary_header ul li{ 
    background-image:url(../images/audio_icon.png); 
    background-repeat:no-repeat; 
    background-position:0px; 
    padding:0 15px; 
    float:left; 
    list-style:none; 
    line-height:60px; 
    height:60px; 
    cursor:pointer; 

} 

.secondary_header ul li:hover{ 
    color:#09F; 
} 
Смежные вопросы