[CSS:] Umsetzung von 'min-height' in Safari

[maceis]

Hallo zusammen,

die Anzeige von 'min-height' in Safari entspricht nicht meinen Erwartungen.

wenn ich eine div-Box mit 'height: 95' deklariere, wird sie größer dargestellt, als es dem Content entsprechen würde.
Nun hatte ich erwartet, dass die Box mit 'min-height: 95%' vergrößert wird, wenn der Contene klein ist, ansonsten aber normal groß bleibt.

Ist das Problem bekannt ?
Kann man es lösen ?

 

[Nogger]

Nun hatte ich erwartet, dass die Box mit 'min-height: 95%' vergrößert wird, wenn der Contene klein ist, ansonsten aber normal groß bleibt.

min-height wird von Safari nicht unterstützt.

http://developer.apple.com/internet/safari/safari_css.html

 

[michanismus]

du darfst nicht vergessen das bei der höhenangabe auch padding und margin eine rolle spielen!
hast du margin: 2px; und padding:2px; hast du für eine höhe von 95 die eigentliche höhe von 87px

87+(2*2+2*2)=95

 

[Nogger]

du darfst nicht vergessen das bei der höhenangabe auch padding und margin eine rolle spielen!

Nein, tun sie nicht. Height ist die Höhe des Content Bereichs, Padding und Margin werden bei der Eigenschaft height nicht berücksichtigt.

http://www.w3.org/TR/CSS21/box.html#box-dimensions

 

[michanismus]

Nein, tun sie nicht. Height ist die Höhe des Content Bereichs, Padding und Margin werden bei der Eigenschaft height nicht berücksichtigt.

http://www.w3.org/TR/CSS21/box.html#box-dimensions

hmm, laut dem buch WEB STANDARDS SOLUTIONS von Dan Cederholm mus aber eben genau diese berechnung für das box-modell genutzt werden! ich programmiere schon seit jahren genau nach dieser methode und bei mir läuft so alles wunderbar

 

[michanismus]

oh, sorry. habe gerade gelesen, dass die berechnung der höhe und breite ausschliesslich bei IE5/Win benutzt werden muss da dieser den standard wie so oft nicht korrekt interpretiert.

abhilfe schaft halt die angabe von genau 2 mal width oder height in den css angaben.

mein fehler sorry

 

[maceis]

Danke für die Antworten und die Links.

Kennt jemand einen Workaround?

 

[Nogger]

Wenn du willst, daß eine Box eine Box immer den kompletten Inhalt einschließt, dabei aber mindestens 95px hoch ist, mußt du wohl eine Stütze in die Box legen.

Stütze: Etwas, was die gewünschte Höhe braucht, aber nicht sichtbar ist. Es verhindert dann, daß die Box kleiner wird als die Stütze.

Vielleicht ein transparentes 95px hohes, 1px breites GIF. Oder

<div style="float: right; height: 95px; width: 1px; margin: 0;"></div>

an den Anfang der Inhalts und an das Ende noch ein Element mit clear: right;

 

[maceis]

...
<div style="float: right; height: 95px; width: 1px; margin: 0;"></div>

an den Anfang der Inhalts und an das Ende noch ein Element mit clear: right;

Danke, so ähnlich funktioniert es:

<p style="float: right; height: 95px; width: 1px; margin: 0;">
<div>
...
<p style="clear: right;">