DIV mit min-height?

[Amarok365]

Hallo,

schon wieder gibt es bei meinem Projekt das nächste Kopfkratzen - hier:

http://www.sender-zitrone.de/medien/disko.htm

In den DIV-Boxen soll erst die 120 px hohe Grafik dargestellt werden und dann der Text. Dieser ist aber manchmal kurz und manchmal lang, bei kurzem Text hängt die Grafik dann aus der Box raus (erkennbar an den ersten beiden Bildern). Ich versuchte den DIV mit "min-height" zu bändigen, aber das geht offensichtlich nicht (in Firefox hängt's immer noch raus). Wie kann man erreichen, dass die Grafiken in der Box bleiben bzw. diese eine Mindesthöhe behalten, wenn der Inhalt kurz ist? Ideal wäre es, Abstände für die Bilder einzusetzen, die den Boxrand quasi unten "wegdrücken" - nur wie?

Beste Grüße von

[His.Master's.Voice]

Hallo, hast du schon mal die Suche benutzt. Min-height Probleme sind hier schon sehr oft behandelt worden!

http://www.traum-projekt.com/forum/s...archid=2138537

[Amarok365]

Naja, aus den anderen Beispielen bin ich nicht schlau geworden. Aber nach einigem Suchen habe ich diese Lösung gefunden, und es funktioniert im IE und FF:

min-height:123px;
height:auto !important;
height:123px;

Damit haben meine Boxen eine Mindestgröße und trotzdem erweitern sich die Boxen, wenn mehr Text innen ist.

Beste Grüße von

[Boris]

Weißt du denn, auch warum das funktionert?

[Amarok365]

Weißt du denn, auch warum das funktionert?

So ungefähr: height ist für den IE, height:auto mit der Anweisung !important und min-height ist für andere Browser. Für den IE ist die Angabe der festen Höhe ausreichend, größeres wird ausgedehnt, die Höhe für andere Browser ist mit dem Rest variabel.
Oder?

Beste Grüße von

[Boris]

Der IE kennt kein min-height. Da er aber fälschlicherweise height genau so interpretiert wie min-height, setzt man für ihn height.

Damit das die "braven" Browser aber nicht auch übernehmen, wird height: auto !important gesetzt - was der IE nicht mitbekommt.

So oder so, solltest du alle Extraangaben für die IEs besser in ein seperates CSS schreiben und mit Conditional Comments einbinden. Das spart dir auch eine Menge Zeilen und du hast ein "sauberes" CSS.

[Amarok365]

Viel lieber wäre mir (und den Millionen von anderen Webseiten-Gestaltern auch) ein einmaliges CSS, dass alle Browser verstehen und jede Webseite überall gleich aussehen ließe. Wer braucht Hacks und Comments für Bugs, die keiner kennt und haben will...

Beste Grüße von