[CSS] Zagnieżdżona lista w Chrome

Dla specjalistów Webmastering
#1

Mam zagnieżdżoną listę, która ma być menu na górze strony.

[code]ul {float: left; margin: 10px; list-style: none; background: #80ff80} li {float: left; margin: 0; padding: 0 0 0 10px; } ul li ul {float: right; margin: 0 0 0 0; padding: 0; background: #ffff80} ul li ul li {float: left; margin: 0; padding: 0 0 0 10px;}

W Firefoxie, IE 8 i Operze wygląda jak powinna.

firefoxlista.th.png

A w Chrome (a więc pewnie też w Safari) tak:

chromelista.th.png

Co zrobić, by i w Chrome wyglądało to tak jak chcę?

#2

pierwszy element

drugi element

trzeci element

wewnętrzny element

drugi wewnętrzny element

trzeci wewnętrzny element

czwarty element

Pozdrawiam.

#3

No tak, ale to nie jest rozwiązanie bo to nie jest lista zagnieżdżona. Mi zaś chodzi o to, by lista zagnieżdżona po włączeniu opływania wyświetlała się w Chrome tak jak lista niezagnieżdżona. Tak samo jak się wyświetla w innych przeglądarkach.

Swoją drogą ciekawe czy ten inny sposób wyświetlania w Chrome to błąd Google przy tworzeniu przeglądarki czy to inni producenci się mylą.

#4

Obrazki są te same.

Spróbuj powywalać wszystkie floaty, a zamiast nich dać w ul i li display:inline;

Zawsze zeruj domyślne style przeglądarki http://meyerweb.com/eric/tools/css/reset/

#5

Widać, że Chrome powiela ten sam błąd co… MSIE (sic!) :D! Nie ignoruje w kodzie HTML znaku końca linii ;].

Zamiast tak :

[code]

#6

Rozwiązania mojego problemu podane przez athei oraz GediMaster są poprawne. Dlatego tym panom składam poklonr.gif

Natomiast skandynowi dziękuję za dobre chęci.