nicht angemeldet
Nicht 100% Höhe bei padding, warum?
Hi,
warum vergrössert padding eine Seite, auch wenn durch wenig Inhalt das gar nicht nötig wäre? Die folgende Code soll eine Seite mit 100% Höhe erzeugen, aber es wird höher, weil ich 2 Div jeweils 5px padding gebe. Nun ist der Inhalt aber so gut wie NULL und somit genug Platz bevor überhaupt padding eingreifen muss, da hätte ich erwartet das passt sich dann wie bei einer Tabellenlösung. Bei Margin würde ich es ja noch verstehen, aber padding... Gibt es einen Grund dafür?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
<html>
<head>
<title>Warum nicht 100 Prozent</title>
<style type="text/css">
*{font-family:arial;margin:0;padding:0;}
body,html{font-size:12px;height:100%;width:100%;margin:0;padding:0;}
#header {height:30%;padding:5px;background-color:red;text-align:center;}
#content{height:60%;text-align:center;}
#footer{height:10%;padding:5px;background-color:red;text-align:center;}
</style>
</head>
<body>
<div id="header"><h1>header</h1></div>
<div id="content">content</div>
<div id="footer">footer</div>
</body>
</html>
Tim
-
Hi,
warum vergrössert padding eine Seite, auch wenn durch wenig Inhalt das gar nicht nötig wäre? Die folgende Code soll eine Seite mit 100% Höhe erzeugen, aber es wird höher, weil ich 2 Div jeweils 5px padding gebe.
Natuerlich, so muss es sein - so ist die Berechnung der Gesamthoehe laut Box Model definiert.
http://de.selfhtml.org/css/formate/box_modell.htm#w3cMfG ChrisB
--
„This is the author's opinion, not necessarily that of Starbucks.“-
Hi,
Natuerlich, so muss es sein - so ist die Berechnung der Gesamthoehe laut Box Model definiert.
http://de.selfhtml.org/css/formate/box_modell.htm#w3cja das es so vorgesehen ist, war mir schnell klar, aber macht das Sinn?
Ich meine, wie soll ich denn nun 100% hinbekommen? Doch nur durch weitere Container oder das padding in Prozent angeben, was unschön werden kann, und dann bei den Divs abziehen. Da möchte man doch gleich lieber wieder eine Tabelle nehmen. Oder übersehe ich eine Möglichkeit?
Tim
-
Hi,
Ich meine, wie soll ich denn nun 100% hinbekommen? Doch nur durch weitere Container
Die Container haben doch bestimmt auch Inhalte? Dann gebe denen entsprechende Abstaende.
oder das padding in Prozent angeben, was unschön werden kann, und dann bei den Divs abziehen.
Das wird dir eh nicht viel bringen, weil Prozentangaben fuer padding sich auf die Breite des Elements beziehen.
MfG ChrisB
--
„This is the author's opinion, not necessarily that of Starbucks.“-
Hi,
Die Container haben doch bestimmt auch Inhalte? Dann gebe denen entsprechende Abstaende.
Einem Text Abstände geben? Du meinst damit bestimmt, wie ich schon angekreidet hatte, unnötige zusätzliche Elemente?
oder das padding in Prozent angeben, was unschön werden kann, und dann bei den Divs abziehen.
Das wird dir eh nicht viel bringen, weil Prozentangaben fuer padding sich auf die Breite des Elements beziehen.
Breite bezieht...? Wie ist das gemeint? Padding bezeichnet den inneren Abstand zum Inhalt, sowohl in Breite als auch Höhe, zumindest dachte ich das bisher und es sieht auch so aus. Und ich ich habe das mal mit Prozent aus Neugierde getestet, das funktioniert kurioserweise aber nur wenn ich die paddings anstatt zu verdoppeln, verfierfache. also bei meinem Beispiel wären das dann bei padding:1%; 8% die ich abziehen muss. Auch nicht gerade logisch.
Aber nochmal zu meinem Beispiel. Ich möchte auch noch einen Border ober-und unterhalb vom content-div zur Akzentuierung. Dieser jeweils eine Pixel zerstört mir natürlich auch meine 100% Höhe. Nur wie ziehe ich 1px von 100% ab?
Tim
-
Hi,
Die Container haben doch bestimmt auch Inhalte? Dann gebe denen entsprechende Abstaende.
Einem Text Abstände geben? Du meinst damit bestimmt, wie ich schon angekreidet hatte, unnötige zusätzliche Elemente?
Wenn du Ueberschriften und Fliesstext einfach so in Div-Container klatschtst, dann *fehlen* ziemlich sicher Elemente - Ueberschriften und Absaetze.
Das wird dir eh nicht viel bringen, weil Prozentangaben fuer padding sich auf die Breite des Elements beziehen.
Breite bezieht...? Wie ist das gemeint?
So, wie's da steht.
Padding bezeichnet den inneren Abstand zum Inhalt, sowohl in Breite als auch Höhe, zumindest dachte ich das bisher und es sieht auch so aus.
Ja - aber Prozentangaben fuer padding beziehen sich auf die Breite es Elementes.
Und ich ich habe das mal mit Prozent aus Neugierde getestet, das funktioniert kurioserweise aber nur wenn ich die paddings anstatt zu verdoppeln, verfierfache. also bei meinem Beispiel wären das dann bei padding:1%; 8% die ich abziehen muss. Auch nicht gerade logisch.
Dann wird das bei der Breite, die das Element bei deiner Viewport-Breite aktuell hat, zufaellig so hinkommen.
MfG ChrisB
--
„This is the author's opinion, not necessarily that of Starbucks.“
-
-
-
-