div hoehe

[js-mueller]

Ich hab ein Problem mit dem unten aufgeführtem Code abschnitt. Und zwar wird das haupt div nicht in die länge gezogen obwohl die darin stehenden container länger sind.
Woran liegt das?

       <div id="inhalt">
            <div style="width: 135px; padding: 0px 0px 0px 15px; float: left;">
                <strong>R&ouml;MMS!</strong><br />
                &nbsp;&nbsp;Neuigkeiten<br />
                &nbsp;&nbsp;Kalender<br />
                &nbsp;&nbsp;Mitglieder<br />
                &nbsp;&nbsp;Schlachten<br /><br />
                <strong>Kommunikation</strong><br />
                &nbsp;&nbsp;Kontaktformular<br />
                &nbsp;&nbsp;Forum<br />
                &nbsp;&nbsp;G&auml;stebuch<br /><br />
                <strong>Diverses</strong><br />
                &nbsp;&nbsp;Dateien<br />
                &nbsp;&nbsp;Linkliste<br /><br />
                <strong>Partner</strong><br /><br />
                &nbsp;&nbsp;<img src="grafiken/partner/wow.gamona.gif" />
            </div>
            <div style="width: 665px; padding: 0px 0px 0px 25px; float: left;">Hallo</div>
            <div style="width: 120px; padding: 0px 0px 0px 30px; float: left;">
                <img src="grafiken/symbole/battle.jpg" />
                <img src="grafiken/symbole/gilde.jpg" />
            </div>
        </div>


inhalt:

#inhalt
{
    width: 990px;
    background-image: url('../grafiken/index/inhalt.jpg');
}

edit:

falsches forum. Kann das Bitte wer verschieben ;-)

 

[Quaese]

Hi,

mal im falschen Forum antworten.

Das Problem tritt auf, da Du im Inhalts-Container die DIVs mit float: left in den
Textfluss aufgenommen hast. Um die Höhe anzupassen, musst Du ein Element
einfügen, welches den Textfluss wieder aufhebt.

Am besten erstellst Du ein Dummy-Div, das keine Grösse besitzt und fügst dieses
als letztes Element in den Inhalts-Container ein.

CSS für Dummy-Div:

.dummy{ line-height: 0px;
        font-size: 0px;
        height: 0px;
        clear: left;}

Der HTML-Code:

<div id="inhalt">
    <div style="width: 135px; padding: 0px 0px 0px 15px; float: left;">
        ...
    </div>
    <div style="width: 665px; padding: 0px 0px 0px 25px; float: left;">Hallo</div>
    <div style="width: 120px; padding: 0px 0px 0px 30px; float: left;">
        ...
    </div>
    <div class="dummy">&nbsp;</div>
</div>

Ciao
Quaese

 

[js-mueller]

Das funktioniert fast ;-)

Also das ganze wird jetzts chon schön gezogen. Der footer der noch darunter liegt ist auch am richtigen Platz. Aber der Inhalt bekommt den hintergrund nicht :-/
Also ich hab jetzt nen langezogenes weißes feld

edit:

Hat sich erledigt, hatte das   im dummy vergessen ;-)