Wyrażając

Jeśli kiedykolwiek dokonane (lub co jeden) pionowe menu przy użyciu elementów listy (li) tagi i CSS, jakie można napotkać, to kolejny błąd w przeglądarce Internet Explorer, gdzie IE 6 Wkładki te luki pomiędzy elementami list zawierających elementy poziomie bloków, w tzn. jeśli istnieje białe znaki między elementami listy w kodzie. Dzięki, ale nie dzięki, wersja IE 7 wydaje się wolny od tego błędu.
Jeśli tak jak ja i wiele innych, należysz do tej bandy sfrustrowanych twórców, którzy nadal muszą dostać swoje nowe układy, pracujące w IE6 też, to może okazać się przydatne. Zapraszamy do obejrzenia ...

Markup próbki:

<ul id="menu">
<li> <a href="#"> Strona główna </ a> </ li>
<li> <a href="#"> O </ a> </ li>
<li> <a href="#"> Usługi </ a> </ li>
<li> <a href="#"> Portfolio </ a> </ li>
<li> <a href="#"> FAQ </ a> </ li>
<li> <a href="#"> Kontakt z nami </ a> </ li>
</ Ul>

Możesz stworzyć jakiś CSS, podobny do tego poniżej, aby transfrom powyższy znaczników w pionowym menu ....

Przykładowy CSS ...
# Menu {
margin: 0; padding: 0; background: # FF9900;
list-style-type: none; width: 150px;
}
# Menu li {margin: 0; padding: 0;}
# Menu {display: block;
color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2,5; border-bottom: 1px solid # FFF;
}

Wyniki można zobaczyć ...

Rozwiązanie dla tego błędu ... (zmodyfikowany / dodany CSS pogrubioną kursywą)

# Menu {
margin: 0; padding: 0; background: # FF9900; list-style-type: none; width: 150px;
float: left; / * to zawiera płynęły elementów listy * /
}
# Menu li {
margin: 0; padding: 0;
float: left; / * to poprawki * /
szerokość: 100%; / * błąd białe znaki w IE6 * /
}
# Menu {
display: block; color: # 555555;
text-decoration: none;
padding: 0 15px;
line-height: 2,5; border-bottom: 1px solid # FFF;
}

Jeśli powyższe doesnot rozwiązanie wydaje się działać (z powodów znanych tylko IE6) ... spróbować tej metody zamiast

Wystarczy dodać te dodatkowe IE6 tylko style do znaczników ...

<- [If lt IE 7>
<style type="text/css">
# Menu li {display: inline-block;}
# Menu li {display: block;}
</ Style>
<[Endif] ->