Ashtray: Probleme DIVS zu schachteln

Hallo alle zusamen.

Ich bin im Moment dabei meine Homepage in xhtml neu aufzubauen und habe Probleme, die Divs zu schacheln.

Die Seite soll so aufgebaut sein, dass Links ein Menü (#left) und Rechts ein Menü (#right) in einem übergreifenden div (#huelle) dargestellt werden.

So sieht mein Quelltext aus:

<div id="huelle">
<div id="left">
<a class="left" href="/">Home</a>
</div>
<div id="right">
</div>
</div>

Das Problem hierbei: Die Browser interprätieren das erte </div> Tag als Ende der "Huelle", es soll aber das Ende des "Left" sein. Mit meinem Code wird "Right" eben außerhalb von "Huelle" angezeigt.

Wie kann ich das lösen?

Achja, falls das von intresse ist der Quellcode des CSS Files:

#huelle {
background-color: #ffffff;
height: auto;
width: 1000px;
margin: 100px 40px 10px 70px;
border: 2px solid blue;

}
#left {
background-color: #3B62D7;
height: 400px;
width: 15%;
border: 2px solid black;
}
#right {
background-color: #3B62D7;
height: 400px;
width: 15%;
border: 2px solid black;
float: right;
}

Vielen Dank für eure Hilfe,

MFG

Ashtray

  1. Hi,

    Das Problem hierbei: Die Browser interprätieren das erte </div> Tag als Ende der "Huelle", es soll aber das Ende des "Left" sein. Mit meinem Code wird "Right" eben außerhalb von "Huelle" angezeigt.

    Wie kann ich das lösen?

    In dem du float verstehen lernst.
    http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout

    MfG ChrisB

    --
    “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
    1. Hi,

      Das Problem hierbei: Die Browser interprätieren das erte </div> Tag als Ende der "Huelle", es soll aber das Ende des "Left" sein. Mit meinem Code wird "Right" eben außerhalb von "Huelle" angezeigt.

      Wie kann ich das lösen?

      In dem du float verstehen lernst.
      http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout

      MfG ChrisB

      Also die Sache mit dem Links und Rechts hab ich, denke ich, verstanden. Ich hab die Recht Box jetzt mit margin-left und der entsprechenden Pixelzahl an die rechte Seite geschoben.

      Nur ist sie jetzt immer noch horizontal unter der Linken box. Wieso? Das versteh ich noch nicht?

      1. Hi,

        bitte zitiere sinnvoll, nur das, worauf du konkret Bezug nimmst.

        Also die Sache mit dem Links und Rechts hab ich, denke ich, verstanden. Ich hab die Recht Box jetzt mit margin-left und der entsprechenden Pixelzahl an die rechte Seite geschoben.

        Nur ist sie jetzt immer noch horizontal unter der Linken box. Wieso?

        Weil sie das als gefloatetes Element sein muss.

        Floate das linke Element nach links, und halte das danach folgende rechte ggf. per margin auf Abstand.

        MfG ChrisB

        --
        “Whoever best describes the problem is the person most likely to solve the problem.” [Dan Roam]
        1. Hi,

          bitte zitiere sinnvoll, nur das, worauf du konkret Bezug nimmst.

          Also die Sache mit dem Links und Rechts hab ich, denke ich, verstanden. Ich hab die Recht Box jetzt mit margin-left und der entsprechenden Pixelzahl an die rechte Seite geschoben.

          Nur ist sie jetzt immer noch horizontal unter der Linken box. Wieso?

          Weil sie das als gefloatetes Element sein muss.

          Floate das linke Element nach links, und halte das danach folgende rechte ggf. per margin auf Abstand.

          MfG ChrisB

          Ok, das hat geklappt! Vielen Dank, du hast mir sehr geholfen!

          MFG