Min-Height auch für den IE

Na, es geht doch! Bisher habe ich - vermutlich aufgrund schlampiger Recherchen - immer gedacht, man brächte den IE/Win nicht dazu, einem Container eine minimale Höhe (oder auch Breite, wie auch immer) zuzuweisen, sodass sich der Container jedoch bei größerem Inhalt mitvergrößert (bei den anderen Browsern).

Jetzt hab ich aus aktuellem Anlass mal das Internet durchwühlt und bin bei CSS-Diskuss fündig geworden:

#container {
   height: 300px; /* das hier für den ie */
   background-color: red;
}
/* folgende anweisung wird nicht vom ie interpretiert */
#container[id] {
    height:auto;
    min-height:300px;
}

Ein Beispiel könnt ihr hier sehen.

Unter Anwendung des Attribut-Selektors, welchen der IE nicht kennt, weist man im Nachhinein den anderen Browsern die ebenfalls korrekte CSS-Definition zu! Somit wird die Definition der Höhe für alle Browser außer dem IE (alle = jene, die den Attribut-Selektor interpretieren können) auf “auto” zurückgesetzt, danach wird eine Mindesthöhe zugewiesen!

Das ganze ist nicht einmal ein richtiger Hack, sondern vielmehr das Ausnützen der Schwächen des IE!

Ok, sollte der Einwand kommen, man könne auch den Child-Selector verwenden, dann sage ich: Stimmt :)

Diese Lösung sähe dann wie folgt aus:

#container { /* für alle */
height: 300px;
}
html>body #container { /* be nice to opera (&gekko) */
height: auto;
min-height: 300px;
}

Kommentare:

  1. Flo:
    Dieser "Hack" ist aber auch schon etwas älter! Den hab ich beim entwickeln meiner Seite eingesetzt!



    Das mit den Hacks ist so 'ne Sache! Wenn Microsoft vielleicht doch mal auf die Idee kommt den zukünftigen IE's die Fähigkeiten zu geben, solche Dinge wie den Child-Selektor usw. doch zu lesen dann fängt das ganze Spiel von vorne an! :(



    lg

    Flo
    23. Oktober 2003, 15:44
  2. prefix:
    nein, warum?? dann interpretiert der ie halt wie jeder andere - und die sache funktioniert auch!
    23. Oktober 2003, 17:14

XML-Feed


Login