auto:height die sich dem grösseren Div Element anpassen soll

Status
Nicht offen für weitere Antworten.
Guten Tag!

Ich habe div Elemente die folgendermassen verschachtelt sind:

HTML:
  <div id="contentContent">
   <div id = "bildmenu">###BILD###</div> 
   <div id = "contentInhalt">###CONTENT###</div>
  </div>

Das DIV bildmenu und der DIV contentInhalt sollen eine automatische Höhe erhalten. Ist das Bildmenü länger soll sich die dynamische Höhe dem Bildmenü anpassen. Ist der contentInhalt länger soll sich die auto Höhe diesem Element anpassen.
Mit meinem momentanen CSS funktioniert das im IE jedoch nicht im FF. Der FF passt sich immer dem contentInhalt.

HTML:
#content #contentContent {
 background-color: #FFF;
 border-left: 1px solid #204191;
 border-right: 1px solid #204191;
 padding: 15px 25px 0px 25px;
 height:550px;

}

html>body #content #contentContent {
  min-height:550px;
  height:auto;
}
#contentContent #bildmenu{

    float:left;
    display:block;    


}
#contentContent #contentInhalt{
    display:block;

}

Was mach ich falsch ?

Gruess

Ruth
 
Hi,

da es sich hier um ein Floatumgebung handelt, muss diese zum Abschluss auch "gecleart" werden, damit die umschliessende Box #contentContent ihre tatsächliche Höhe annimmt, und die Spalten sie am unteren Elementrand nicht überlappen - siehe hierzu auch http://positioniseverything.net/easyclearing.html.

Die in dem Artikel genannte Klasse .clearfix wird dann zusätzlich im DIV #contentContent aufgerufen:

Code:
<div id="contentContent" class="clearfix"> ... </div>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück