nicht angemeldet
Padding macht das Div Breiter
Der MartinHi,
ich habe in meiner Seite in div drinnen:
<div style="width:100%;border:solid 1px;">
Text über einige Zeilen
</div>
Mich stört, dass der Text genau am border steht. Also baute ich es so:
<div style="width:100%;padding:3px;border:solid 1px;">
Text über einige Zeilen
</div>
Das läuft, aber nun ist das Div (von dem was man im Browser sieht) größer und es passt nicht mehr mit anderen Elementen.
Ist es irgendwie Möglich, die maximale Gesamtbreite (der Ausgabe) zu definieren? Oder kann ich irgenwie durch ein anderes CSS Element ausgleichen?
Polly
-
Hallo,
<div style="width:100%;padding:3px;border:solid 1px;">
Text über einige Zeilen
</div>
Das läuft, aber nun ist das Div (von dem was man im Browser sieht) größer und es passt nicht mehr mit anderen Elementen.ja, weil width leider nicht die Gesamtbreite des Elements angibt, sondern die Breite seines Inhalts. Die Gesamtbreite ergibt sich, indem man padding, border und margin noch dazuzählt. In deinem Fall ergibt sich also eine Gesamtbreite von (100% + 8px).
Ist es irgendwie Möglich, die maximale Gesamtbreite (der Ausgabe) zu definieren?
Ja - gib einfach keine Breite an. Blockelemente nehmen aufgrund der Voreinstellung sowieso die gesamte verfügbare Breite ein.
Ciao,
Martin--
Die letzten Worte des Fallschirmspringers:
ELENDE SCHEISSMOTTEN!!
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(-
Danke für den Hinweis, ich habe das width:100% gekickt. Nun haut es wunderbar hin
Hallo,
<div style="width:100%;padding:3px;border:solid 1px;">
Text über einige Zeilen
</div>
Das läuft, aber nun ist das Div (von dem was man im Browser sieht) größer und es passt nicht mehr mit anderen Elementen.ja, weil width leider nicht die Gesamtbreite des Elements angibt, sondern die Breite seines Inhalts. Die Gesamtbreite ergibt sich, indem man padding, border und margin noch dazuzählt. In deinem Fall ergibt sich also eine Gesamtbreite von (100% + 8px).
Ist es irgendwie Möglich, die maximale Gesamtbreite (der Ausgabe) zu definieren?
Ja - gib einfach keine Breite an. Blockelemente nehmen aufgrund der Voreinstellung sowieso die gesamte verfügbare Breite ein.
Ciao,
Martin -
Servus,
ja, weil width leider nicht die Gesamtbreite des Elements angibt, sondern die Breite seines Inhalts.
Anmerkung: Dieser Misstand kann in CSS3-fähigen UAs mittels box-sizing:border-box; umgangen werden.
Gruss
Patrick -
ja, weil width leider nicht die Gesamtbreite des Elements angibt, sondern die Breite seines Inhalts.
Aber auch nur in der Voreinstellung und ohne weiteres zutun.
http://www.w3.org/TR/css3-ui/#box-sizing wird mit Ausnahme von IE 6 und 7 von jedem relevanten Browser unterstützt (Webkit und Gecko brauchen zwar noch Herstellerspezifische Eigenschaften, aber es funktioniert dennoch).
Die Gesamtbreite ergibt sich, indem man padding, border und margin noch dazuzählt.
Wenn man die Voreinstellung "content-box" belässt, ja.
-