Prolem z poziomym menu i display:block dla linków w IE6
Autor: izabela
Komentarzy: 0
Odwiedzin: 2613 Dodany: 2010-02-28 16:22:37
No dobrze, wyjaśnijmy sprawę z temanu.
Nie wiem być może nie jest to częsty problem, ale muszę przyznać, że mi trochę czasu zajęło, zanim znalazłam optymalne rozwiązanie.
Ok, od początku.
Chcę utworzyć poziome menu, oczywiście wyberam tutaj listę z linkami, przykładowo
<ul class="menu">
<li><a href="#"> menu 1</a></li>
<li><a href="#"> menu 2</a></li>
<li><a href="#"> menu 3</a></li>
</ul>
W pliku css, ustawiam:
.menu li{
display:block;
float:left;
list-style:none;
}
.menu li a{
display:block;
}
"display: block;" ustawiam ponieważ, moje menu ma być blokowe. I w ie6 - bach, suprice, ponieważ jest to element blokowy, automatycznie, rozwala mi link na całą dostępną szerokość (czyli szerokość elementu nadrzędnego) - NIE NIE!
Co tu robić?
Zrezygnować z blokowości - nie wtedy menu staje się mniej użyteczne (trzba trafić na link).
A może ustawić szerokoś dla każdego linku - no tak to jest jakieś rozwiązanie, ale zupełnie nie elastyczne.
Jak sieokazuje wystarczy usunąć jeden styl, mianowicie usuwając "display:none;" dla znacznika li - rozwiązujemy problem.
Komentarze