Du würdest es besser sehen, wenn du ein border definierst.
Es wird die Eigenschaft overflow:visible aktiv. Das heisst, die innere Tabelle verlasst den Raum der vorgegebenen 20px Höhe.
Ich habe mal einen border vergeben, verstehe aber leider noch nicht, was passiert. Warum kommt das <li> "drei" nicht unterhalb des eingeschachtelten <ul>?
Weil <li> inklusive innerer Liste nicht mehr als 20px hoch sein darf.
Du erzeugst also eine 20px hohe Boc und das folgende äussere <li> Element fügst sich der Regel entsprechend an diese Box an.
Und eine Tabelle habe ich doch nirgendwo definiert, und die Höhe bezieht sich doch auf die Aufzählungspunkte?!
setze mal:
li {overflow:hidden;}
Dann ist die eingeschachtelte <ul> gar nicht mehr zu sehen. Leider verstehe ich noch nicht warum. Ich möchte diese ja sehen, nur sollen die folgenden <li> unterhalb kommen - nicht daneben oder gar nicht!
Dann darfst du aber nicht sagen. dass ein <li> Element mit dem ganzen Inhalt nur 20 px hoch sein darf.
Was genau willst du erreichen?
mfg Beat