nicht angemeldet
Hintergrundfarbe über ganze Seite erstrecken funktioniert nicht
Matthias Apsel
MudGuard
Gunnar BittersmannHallo zusammen,
bräuchte mal Hilfe...
<html>
<body>
<div id="container">
<div id="content">
INHALT
</div>
</div>
<body>
<html>
html, body {
height: 100%;
}
div#container {
min-height: 100%; /*für moderne Browser*/
}
div#content {
min-height: 100%;
background: grey;
}
Kann mir jemand sagen, weshalb sich die Hintergrundfarbe im div#content nicht über den gesamten Viewport erstreckt? Firefox, Safari und Chrome sollten die Eigenschaft eigentlich verstehen. Komischerweise funktioniert mein Vorhaben nur, wenn ich im div#container height: 100%; angebe. Das kann doch nicht sein? Was mache ich falsch?
-
<html>
<body>
<div id="container">
<div id="content">
INHALT
</div>
</div>
</body>
</html>Edit: schließende Tags vergessen-
Om nah hoo pez nyeetz, Padde!
100% wovon? Es müssen _alle_ Elternelemente eine Höhe zugewiesen bekommen, sonst heißt es irgendwann 100% von "auto" und das ist 100% von "so groß wie nötig".
PS Du solltest die Wahl deiner Elemente überdenken. Lies dazu die HTML5-Serie im Blog.
Matthias
--
1/z ist kein Blatt Papier.
-
Hi,
100% wovon? Es müssen _alle_ Elternelemente eine Höhe zugewiesen bekommen
nein.
Erstens: es sind alle Vorfahrenelemente (ein Element hat höchstens ein Elternelement).
Zweitens: wenn eines der Vorfahrenelemente eine absolute Höhenangabe hat, sind die Höhenangaben der Vorfahrenelemente dieses Elements irrelevant. (Dann klappt's natürlich nicht mit 100% = kompletter Viewport ...)
cu,
Andreas--
Warum nennt sich Andreas hier MudGuard?
O o ostern ...
Fachfragen per Mail sind frech, werden ignoriert. Das Forum existiert.
-
@@Matthias Apsel:
nuqneH
… eine Höhe zugewiesen bekommen, sonst heißt es irgendwann 100% von "auto"
Ergänzung: max-height ist keine Zuweisung für height.
PS Du solltest die Wahl deiner Elemente überdenken.
Qapla'
--
„Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)-
@@Matthias Apsel:
nuqneH
… eine Höhe zugewiesen bekommen, sonst heißt es irgendwann 100% von "auto"
Ergänzung: max-height ist keine Zuweisung für height.
PS Du solltest die Wahl deiner Elemente überdenken.
Qapla'
Gruß
PaddeWo steht da max-height?
Im übrigen ist der Code oben nur ein einfaches Beispiel. Ich verwende ausschließlich HTML5, sofern semantisch sinnvoll. Das hat aber mit meiner Frage nichts zu tun.
Hier eine von vielen Referenzen im Web, die außnahmslos alle ein min-height für den #container bzw. #wrapper verwenden:
http://www.gn-webdesign.de/css-tutorials/css-div-height-100.html
-
Om nah hoo pez nyeetz, Padde!
Bitte zitiere sinnvoll, nur das, worauf du dich konkret beziehst.
Wo steht da max-height?
In deinem Ausgangsbeitrag steht: mehrfach min-height: 100%;
#container hat keine festgelegte Höhe, weil min-height keine Angabe für die Höhe ist. max-height ebenso.
Matthias
--
1/z ist kein Blatt Papier.
-
@@Matthias Apsel:
nuqneH
Wo steht da max-height?
In deinem Ausgangsbeitrag steht: mehrfach min-height: 100%;
Ja, min-height meinte ich eigentlich.
Qapla'
--
„Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
-
-
-
-
-