nicht angemeldet
DIVs mit CSS und dyn. Höhe
Hi Leutz,
hab da nen Problem. Das folgende Bsp. sieht unterm IE6 ok aus ... jedoch zerreists unter Netscape ab > 6 alles. Ich denke es liegt daran, das Netscape bei einem Div welches weitere Divs beinhaltet, keine Höhenangabe für das Haupt"Div" hat bzw. kennt (da dies sich dynamisch an den Inhalt anpassen sollte). Irgendeine Idee wie man den folgenden Block in Netscape mit Divs und CSS umsetzen könnte? Als Tabelle funktioniert, aber ich wollts halt gerne via Divs lösen.
http://www.xo8cp.de/div/
greetZ
Sebastian
(www.pixelfashion.net | bastian@pixelfashion.net)
-
Hallo,
#left-holder {...height: 40px;...}
In mozilla wird die höhe von 40px des alles beinhaltenden <div id="left-holder"> auch so angezeigt, ich kann da keine fehldarstellung erkennen, die du vom css her nicht willst
Gruss, Jan aus Dresden
-
Hi!
hmmm das ist ja komisch. Also wenn ich mir die Seite mit Netscape 7.02 anzeigen lasse > sehe ich den kompletten Text / der Div-Hintergrund von #left-holder erstreckt sich noch nich mal bis über den ersten Absatz / und die Schatten "rechts" und "unten" sind über dem Text positioniert und nicht wie beabsichtigt über den Seiten?
Ciao
Sebastian-
Hallo,
Also wenn ich mir die Seite mit Netscape 7.02 anzeigen lasse > sehe ich den kompletten Text / der Div-Hintergrund von #left-holder erstreckt sich noch nich mal bis über den ersten Absatz
Ja, bei mir sieht es genauso aus.
Aber so "willst" du es doch auch haben, #left-holder{height:40px}.
Lass dochmal die höhen angabe weg, oder setze sie, inclusive <body> und <html> auch auf 100%.
Wenn du height:..; drinn läst solltest du noch eine angabe mit overflow hinzufügen um den browser mitzuteilen was er mit dem <div> anstellen soll wenn mehr inhalt da ist als vom platz her rein passt.Gruss, Jan aus Dresden
-
Hi!
ne der Text soll ja schon komplett sichtbar bleiben. Nur der Hintergrund ist zu klein. Hab nochmal n Screenshot mit hochgeladen (da sieht man wie es sein soll) = IE6
cu
Sebastian-
Hallo,
also nochmal.
Was soll die angabe heigth:40px;?
NN stellt die box dann eben 40px hoch dar, schibt den text darüber hinaus und somit ist dein hintergrund nur 40px hoch.
Die angabe overflow:auto; könnte abhife schaffen.
Aber eigentlich ist die höhenangabe doch eh nutzlos, lass sie weg.
und die anderen auch, dann sieht es so aus wie im ie, der hintergrund.body {
font-family : Arial;
font-size : 12px;
font-stretch : wider;
color : #606060;}
#left-holder {
width: 405px;
position: relative;
border: 1px none #000000;}#left-content {
float: left;
width: 400px;
text-align: left;
padding: 10px;
border: 1px solid #A5A5A5;
background: #F8F8F8 none;}was mit dem schatten ist kann ich nicht erahnen.
Imho wird das so oder so probleme machen vieleicht ist es sinnvoll den schatten etwas anders zu erzeugnen, vieleicht <div> in <div> und mit negativen padding oder marginwerten spielen, probieren.mfg
Gruss, Jan aus Dresden
-
Hallo Sebastian,
ne der Text soll ja schon komplett sichtbar bleiben. Nur der Hintergrund ist zu klein. Hab nochmal n Screenshot mit hochgeladen (da sieht man wie es sein soll) = IE6
Jan hat natürlich völlig recht: height: 40px; ist Unsinn und sollte als erstes entfernt werden.
Aber dein Hauptproblem liegt darin, dass Mozilla/NN6+ das W3C-Boxmodell im Unterschied zum IE richtig umsetzen.
Deine div #left-holder umschließt drei andere Divs, die alle auf float gesetzt sind. Damit haben Sie keinen Einfluss auf die Höhe des umgebenden Elements.
Wenn du erreichen möchtest, dass sich die Höhe von #left-holder
an den Inhalt anpasst musst du am Ende noch ein Element unterbringen, das explizit den normalen Dokumentfluß wieder herstellt.
z.Bsp. <div style="clear: both; height: 1px;"></div>Gruß Susanne
-
-
-
-