есть меню на сайте http://www.alpari.org/
пытаюсь переверстать его
html:
| Код |
<div id="new_menu">
<ul class="main_menu">
<li class="main_menu_1"><a href="#" class="menu_link">Menu item</a>
</li>
<li class="main_menu_2"><a href="#">Menu item</a>
</li>
</ul>
<ul class="main_menu">
<li class="main_menu_1 current_menu"><a href="#">Menu item</a>
<ul class="sub1">
<li> <a href="#">Subhead 1Subhead 1Subhead 1</a>
<ul class="sub2">
<li> Subhead2 Subhead2 Subhead2
</li>
</ul>
</li>
</ul>
</li>
<li class="main_menu_2"><a href="#">Menu item</a>
</li>
</ul>
<ul class="main_menu">
<li class="main_menu_1"><a href="#">Menu item</a>
</li>
<li class="main_menu_2"><a href="#">Menu item</a>
</li>
</ul>
<ul class="main_menu">
<li class="main_menu_1"><a href="#">Menu item</a>
</li>
<li class="main_menu_2 current_menu"><a href="#">Menu item</a>
</li>
</ul>
<ul class="main_menu">
<li class="main_menu_1"><a href="#">Menu item</a>
</li>
<li class="main_menu_2"><a href="#">Menu item</a>
</li>
</ul>
</div>
|
css:
| Код |
*{
padding: 0;
margin: 0;
}
#new_menu{
padding: 30px;
}
* html .main_menu{
width: 10px;
}
* html .main_menu a{
float: right;
padding-left: 20px;
}
#new_menu ul.main_menu{
min-width: 10px;
float: left;
padding-right: 4em;
text-transform: uppercase;
font-size: 11px;
letter-spacing: 0.1em;
list-style: none;
}
#new_menu ul.main_menu li a{
padding-left: 20px;
}
#new_menu ul.main_menu li ul li a{
padding: 0;
}
.main_menu_1 ul.sub1{
text-transform: none;
font-size: 12px;
padding-left: 20px;
padding-top: 80px;
width: 10px;
list-style: none;
}
.main_menu_2 ul.sub1{
text-transform: none;
font-size: 12px;
padding-left: 20px;
padding-top: 57px;
width: 10px;
list-style: none;
}
.main_menu_1 ul.sub2,
.main_menu_2 ul.sub2{
text-transform: none;
font-size: 12px;
padding-left: 30px;
width: 10px;
list-style: none;
}
#new_menu li{
white-space: nowrap;
height: 23px;
}
|
так вот в ie5-6 получаеся лажа, а в ie7, opera, ff все так как надо. весь день долблюсь, не могу ничего сделать...
подскажите в чем проблема |