VPF::Проблемы с выпадающем меню в IE6

ИванМ

Дата 22.10.2010, 14:33 (ссылка)

(нет голосов)

Загрузка ...

Эксперт

Профиль
Группа: Завсегдатай
Сообщений: 1260
Регистрация: 19.6.2006
Где: СПб

Репутация: нет
Всего: 23

В IE6 между пунктами выпадающего вертикального меню пустое пространство. В других браузерах все норм. Как понимаю, что-то связанное с layout. Но как я не крутил, и zoom: 1 и что только не делал все равно проблема остается.
Вот часть html-кода:

Код


<ul class="menu" id="menu">
<li>
    <a href='/#progs'>Программы</a>
    <ul>
        <li><a href='/#progs'>Защита информации</a></li>
        <li><a href='/#progs'>Организация ЭВМ</a></li>
    </ul>
</li>
<li><a href='/#links'>Ссылки</a></li>
</ul>

css:

Код


ul.menu { 
margin: 0px; 
padding: 0px; 
float: left; 
list-style-type:none; 
}

ul.menu li{ 
margin: 0px; 
padding: 0px; 
height: 54px;
float: left; 
position: relative;  
}

ul.menu li a{ 
color: #AA3;
margin: 0px;
padding: 15px 10px 0px 10px;
height:39px;
display: block; 
float: left; 
text-decoration: none;
font-weight: bold; 
font-size: 18px;
font-family: Georgia, 'Times New Roman', serif;
}

ul.menu li a:hover{ 
color: #AA3;
background: #3371AA; 
}

li ul{
position: absolute;
display: none;
margin: 0px;
padding: 0px;
margin-top: 50px;
list-style-type:none; 
}

ul.menu li ul li{
background: #149; 
margin: 0px;
padding: 0px;
float: none;
width: 135px;
height: 100%;
}

ul.menu li ul li a{
padding: 5px;
margin: 0px;
height: 100%;
width: 100%;
background: #159; 
}

* html li ul{
left: 0px;
top: 0px;
}

li:hover ul, li.over ul{
display: block;
}

JS:

Код


function startMenu(){
var nav=document.getElementById('menu');

  for(var i=0;i<nav.childNodes.length;i++){
    var node=nav.childNodes[i];
    if (node.nodeName=='LI'){
      node.onmouseover=function(){
        this.className='over';
      }
      node.onmouseout=function(){
        this.className='';
      }
    }
  }
}
startMenu();

Это сообщение отредактировал(а) ИванМ - 22.10.2010, 14:34

MaxTex

Дата 29.10.2010, 14:48 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 29
Регистрация: 29.10.2010
Где: Орел

Репутация: нет
Всего: нет

Можно попробовать изменить CSS свойство ul.menu li ul li, задав высоту в пикселях:

Код


ul.menu li ul li {
// height: 50px;
}

// перед свойством, чтобы оно воспринималось лишь браузерами IE всех версий.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »