CSS div Problem
CyTrobIc 07.06.2009 - 13:47 946 10
CyTrobIc
Big d00d
|
Moin,
ich habe einen Div Container wo mehrere kleinere Div's mit float:left attribut enthalten sind, nun definiere ich im umfassenden Div Container ein Hintergrundbild, das aber nicht angezeigt wird. Setze ich die Höhe des umfassenden Div's manuell auf z.b. 100 wird mir das Hintergrundbild angezeigt. Wieso wächst dieser Div bei float:left beeinhalteten Divs nicht in der Höhe mit ? wie kann man das lösen ?
danke Gerrit
|
vanHell
Tauren Marine
|
bitte (beispielhaften) code posten sonst hat das ganze keinen sinn
|
Spikx
My Little Pwny
|
CyTrobIc: floating elements und absolute positioned elements verändern nicht die Größe des parent elements. Im Falle der floating elements brauchst du nach allen floating elements einfach nur ein <div style="clear:both;"></div>
damit das parent element wächst.
|
fatmike182
Agnotologe
|
aber so weit ich weiß wird das auch an dem Problem nix ändern, dass das div in der Größe mitwächst! (zumindest hab ich das Problem einige Zeit lang mit dem Firefox gehabt)
|
Spikx
My Little Pwny
|
aber so weit ich weiß wird das auch an dem Problem nix ändern, dass das div in der Größe mitwächst! (zumindest hab ich das Problem einige Zeit lang mit dem Firefox gehabt) Doch, genau das lässt das element "wachsen", da sich nun ein non-floating div nach allen floating divs befindet. Und daher muss das parent element auch zwangsläufig auf die Größe der Position des clearing divs anwachsen. Man kann das auch ohne clearing div lösen, allerdings ist das dann wieder etwas schwindliger und/oder funktioniert nicht in jedem Browser gleich. Hier gibt es eine Zusammenfassung der Methoden ohne clearing div.
Bearbeitet von Spikx am 07.06.2009, 15:59
|
CyTrobIc
Big d00d
|
Dank dir Spikx werd es nachher mal testen.
|
CyTrobIc
Big d00d
|
Hmm, also bei nem Kollegen wirds jetzt korrekt angezeigt (Firefox 3), bei mir nicht, weder im IE7 noch im Firefox 3... ?
|
Probmaker
1.0.0.721
|
Hmm, also bei nem Kollegen wirds jetzt korrekt angezeigt (Firefox 3), bei mir nicht, weder im IE7 noch im Firefox 3... ? cache geleert?
|
CyTrobIc
Big d00d
|
Jo klar... trotzdem nicht. Beispielcode, hab ich nen Denkfehler ?: <div style="left: 250px; width: 350px; position: relative;">
<div style="position: relative; width: 350px; background-image: url(termbox_mid.jpg);">
<div style="width: 90px; float: left;">A</div> <div style="width: 240px; float: left;">1</div>
<div style="width: 90px; float: left;">B</div> <div style="width: 240px; float: left;">2</div>
<div style="width: 90px; float: left;">C</div> <div style="width: 240px; float: left;">3</div>
<div style="clear: both;"></div>
</div>
</div>
Bearbeitet von CyTrobIc am 07.06.2009, 21:50
|
Spikx
My Little Pwny
|
Also dein Beispiel-code funktioniert im FF3 und IE7 bei mir.
|
CyTrobIc
Big d00d
|
Mist, jetzt bei mir auch, hatte auf dem Testrechner noch Firefox 1.07 :-/
Daran lags dann, mit dem IE7 geht's aber nach wie vor nicht (nur bei mir). Ist aber auch egal wenn es bei den anderen läuft, evtl. hat der nen Schuß.
Danke aber nochmal.
|