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

maceis

Aktives Mitglied
Thread Starter
Registriert
24.09.2003
Beiträge
16.879
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 ?
 

michanismus

Mitglied
Registriert
23.08.2004
Beiträge
434
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
 

michanismus

Mitglied
Registriert
23.08.2004
Beiträge
434
Nogger schrieb:
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

Mitglied
Registriert
23.08.2004
Beiträge
434
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

Aktives Mitglied
Thread Starter
Registriert
24.09.2003
Beiträge
16.879
Danke für die Antworten und die Links.

Kennt jemand einen Workaround?
 

Nogger

Mitglied
Registriert
03.08.2004
Beiträge
372
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

Aktives Mitglied
Thread Starter
Registriert
24.09.2003
Beiträge
16.879
Nogger schrieb:
...
<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:
HTML:
<p style="float: right; height: 95px; width: 1px; margin: 0;">
<div>
...
<p style="clear: right;">
 
Oben