Verschachtelte Divs die mitwachsen

ray2mi

Erfahrenes Mitglied
Hallo,

ich habe eine Seite, die sich dem Inhalt anpassen soll.
- 3 Spalten, die immer gleich groß sind...mit faux colums oder wie man das nennt habe ich das gemacht
- mittlere Spalte ist für Content gedacht
- ContentBox soll aber nochmals in 2 geteilt werden
- ich habe also nochmal 2 div spalten da hinein gepackt

Problem
- beim füllen mit Inhalt, wächst die eigentliche Content Box nicht mit

Nur der IE6 stellt diesemal alles korrekt dar aber die anderen Browser zeigen den Inhalt dar, aber die Höhe wird nicht angepasst.

Kann man das also irgendwie lösen?

Code:
div#contentbx {
	background-color: transparent;
	color: #666;
	width: 888px; /*Breite 888px*/
	min-height: 644px; 
	height: auto !important;
	float: left;
}
	*html div#contentbx {
		height: 644px;
	}


div#inhalt {
	background-image: url(../design/content-main.jpg);
	background-repeat: no-repeat;
	background-position: top-left;
	width: 674px;
	height: 511px;
	float: left;
}

div#infobereich {
	background-image: url(../design/content-right.jpg);
	background-repeat: no-repeat;
	background-position: top-right;
	width: 214px;
	height: 511px;
	float: right;
}

HTML:
<div id="contentbx">
    
    	<div id="content">
        	<div id="inhalt"><!--ContentMain-->
  Hier steht dann der Text 1
            </div><!--ENDE INHALT -->
            
            <div id="infobereich"><!--Content Right-->
  Hier steht dann der Text 2
            </div><!--ENDE INFOBEREICH-->
        </div>
    </div><!--Ende ContentBox-->

Das Ding ist, das ich der ContentBx ja schon die oben aufgeführten CSS Werte dazugeben musste, damit diese überhaupt wächst.
Das bedeutet, wenn ich den Inhalt einfach in die ContentBx packe, dann wächst alles sehr schön mit.
Aber wenn ich den Text in "Content" oder "Infobereich" packe, dann wächst es nur im IE6 schön mit, in anderen Browsern wächst gar nichts aber der Text wird angezeigt
 
Moin,

wenn du schon nicht die hiesige Suchfunktion nutzt, werf bitte erstmal einen Blick in die CSS - FAQ, die hier in der Forenübersicht ganz oben festgehalten und als Wichtig ausgezeichnet ist, um zu schauen, ob das Problem darin nicht schon aufgeführt ist, und einen weiteren Thread erspart :rolleyes:
CSS - FAQ hat gesagt.:

Desweiteren wird die height:511px-Deklaration der inneren DIVs von den standardkonformen Browsern als feste Höhe interpretiert, und lassen diese in der Höhe nicht mitwachsen.

mfg Maik
 
ja an sowas hatte ich ja auch gedacht...aber irgendwie will das ganze nicht so richtig, wenn ich an der einen Stelle cleare dann verschiebt sich bei mir eine Spalte.
Mein Layout ist auch ziemlich oft verschachtelt.
Ich habe meine Datei mal in den Anhang gemacht...vieleicht schaust du mal rein :confused:
 

Anhänge

Hurray Hurray....
mensch du kannst dir immer gar nicht vorstellen wie Dankbar ich für deine Hilfe bin...

also es hat an den höhen gelegen, super, geil
aber ein Problem gibts da noch, du hast sicherlich wie immer ne Lösung am begin.

Ich habe eine Hintergrundgrafik, deswegen auch die Höhe von 511px, weil die genau 511px hoch ist und der Browser diese mindestens anzeigen soll.
Das klappt auch überall außer beim IE6...der zeigt nur so viel an, wie in dem Div Inhalt plaziert wurde.

Ich habe bereits mit *html div#....
eine Höhe vergeben aber er macht das trotzdem...
kann ich es nun auch so einstellen, dass der IE6 immer eine höhe von mindestens 511px animmt, sodass die Hintergrundgrafik immer angezeigt wird
weil ansonsten muss ich die Divs immer mit Inhalt füllen, der diese Höhe ausfüllt

##EDIT##

stop stop....sorry
ich habs schon gefunden...
ich hatte eine

min-height: 644px;
height: auto !important;

vergeben und als ich

height: auto !important;

weggenommen habe, hat es funktioniert, ich weiß zwar nicht warum aber es funktioniert
 
Ich habe eine Hintergrundgrafik, deswegen auch die Höhe von 511px, weil die genau 511px hoch ist und der Browser diese mindestens anzeigen soll.
Das klappt auch überall außer beim IE6...der zeigt nur so viel an, wie in dem Div Inhalt plaziert wurde.

Ich habe bereits mit *html div#....
eine Höhe vergeben aber er macht das trotzdem...
kann ich es nun auch so einstellen, dass der IE6 immer eine höhe von mindestens 511px animmt, sodass die Hintergrundgrafik immer angezeigt wird
weil ansonsten muss ich die Divs immer mit Inhalt füllen, der diese Höhe ausfüllt
Von welchem DIV-Block sprichst du hier?

So, wie du es beschrieben hast, sollte der IE6 dies auch so umsetzen.

Übrigens wird der Star-HTML-Hack mit einem Leerzeichen zwischen * und html notiert.

mfg Maik

//edit: Hat sich dann zwischenzeitlich erledigt.
 
Zurück