/ (CSS): Paddings in DIVs / IE <> Firefox
wiberg
- browser
Hi,
Ich habe hier zwei DIVs, das eine absolut positioniert, das andere darin. Letzteres hat eigentlich die genau passende Größe, doch wenn ich ihm ein padding:5px; verpasse, wird es um 10px breiter und höher und "sprengt den Rahmen" (Ich bin mir zwar fast sicher, dass das Thema hier schon behandelt wurde, aber die Suche hier und @ Google ergab nix hilfreiches). Im IE 6 funktioniert's (bzw: es wird falsch, aber dafür so, wie ich's will interpretiert). Was mich wundert: Ich habe dem inneren DIV doch eine definierte Breite gegeben! Wieso hält Firefox sich nicht daran? Hier der Code:
<div style="position:absolute; left:242px; top:96px; width:485px; ">
<div style="width:475px; margin-left:1px; margin-top:0; (hier "padding" zerpflückt das Design)">
hi!<p> </p>
</div>
</div>
Hi wiberg,
doch wenn ich ihm ein padding:5px; verpasse, wird es um 10px breiter und höher
das ist korrekt. Breite/Höhe = width/height + margin + padding + border.
width:475px; 475
margin-left: 1px; 1
padding: 5px"> 10
Breite = 486
Definiere einen entsprechenden Doctype, um M$IE 6 in den korrekten Rendermodus zu versetzen oder lasse alle Browser falsch rechnen.
http://msdn.microsoft.com/library/en-us/dnie60/html/cssenhancements.asp#cssenhancements_topic2
http://www.mozilla.org/docs/web-developer/quirks/doctypes.html
http://www.opera.com/docs/specs/doctype/
http://gutfeldt.ch/matthias/articles/doctypeswitch.html
http://www.hut.fi/u/hsivonen/doctype.html
Grüße,
Roland
hi,
Definiere einen entsprechenden Doctype, um M$IE 6 in den korrekten Rendermodus zu versetzen oder lasse alle Browser falsch rechnen.
ich sehe gar nicht die notwendigkeit, dem inneren div auch noch eine feste breite zu verpassen - wenn der äussere schon eine hat, warum dann nicht für den inneren nur margin/padding angeben?
und als ergänzung zu deinen links noch der zum artikel von Michael Jendryschik über doctype-switching und render-modi:
http://www.heise.de/ix/artikel/2004/03/136/
gruss,
wahsaga