Listen in CSS horizontal & vertikal anordnen

  • Hallo,

    ich stehe vor einem kleinen Problem, ich möchte meine Website ohne Tabellenlayouts gestalten, weiß aber jetzt nicht mehr weiter.

    Ich möchte eine unsortierte Liste so anordnen das Listeneinträge <li></li> untereinander jedoch Listen selbst <ul></ul> nebeneinander angeordnet werden.

    Wie müsste also für folgende Liste der CSS Teil aussehen?

    MfG
    mephisto2k

  • Dazu brauchst du CSS. Du musst alle <ul>´s nach links floaten und alle <u> <li>´s display:block;'en. Um dann dein Layout nicht zu zerschiessen musst du dann noch hinter jede Liste einen <div class="clear"></div> setzten.
    P.S:

    Code
    .clear { clear: both; }

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!

  • Wow das ging schnell tausend Dank.

    Die Anordnung der Listen ist nun korrekt nur ist jetzt das Layout irgendwie zerschossen...

    Zerschossen in so fern das sich die Listen nun unter dem Navi

    CSS

    HTML

    MfG
    mephisto2k

  • Des mit dem clear hast du nbißl falsch verstanden, halb so wild. Wenn du ein element floatest, wird es zu einem inline-element. Dadurch rutschen block elemente darunter, z.B. dein content nebenan. Das versaut dein layout. Um das zu vergindern, setzt man nach solchen elementen ein block element, daß diesen effekt aufhebt. das wäre ein <div style="clear:both;"></div> .

    HTML
    <ul> <li>foo</li></ul><div style="clear:both;"></div>

    Der, der weiß dass er nichts weiß, weiß mehr als der, der nicht weiß, dass er nichts weiß.

    Wer nach etwas fragt, geht grundsätzlich das Risiko ein, es auch zu bekommen!