apstrakt: Mindesthöhe eines Elements erzwingen

Hallo Selfforum!

Hier ein wirklich banal klingendes Problem: ich bastele HTML-Templates für ein CMS und will, daß darin ein div-Bereich eine gewisse Mindesthöhe hat (sagen wir 400px) - weil links davon und v.a. auch unterhalb Navigations-div-Bereiche

<div id="haupt">
Hier steht zu wenig Text, so daß die Höhe leider künstlich aufgeblasen werden muss. Es könnte aber auch sehr viel Text hier stehen, so daß 400px nicht immer ausreichen.
</div>

Jetzt die Nebenbedinungen: es muss W3C-konformer CSS- und HTML-Code sein, der außerdem irgendwann auch WAI-konform (also behindertengerecht) sein soll und auf allen gängigen Browsern (MSIE 5+, Netscape 6+, Opera 6+, Mozilla) funktioniert.

Theoretisch ist die Lösung ja einfach:
  min-height:400px;

Das interpretiert aber der MSIE nicht. Dem würde zwar ein height:400px reichen, weil der div im Zweifelsfall einfach größer gemacht wird, aber das machen Moz/NN6 und Opera (korrekterweise) nicht mit, die dann zwar den überschüssigen Text anzeigen, aber trotzdem den div-Bereich nicht vergrößern und nachfolgende Blockelemten direkt an den 400er div anhängen, so daß es furchtbar aussieht.

Ich dachte, das mit CSS Hacks hinzukriegen, aber wenn ich zunächst (für MSIE) height:400px; setze und dann (für MSIE versteckt) ein min-height:400px; dann ist der Effekt derselbe wie das einfache height. (Habe mal height:300px und min-height:400px; ausprobiert. Es sah im NN7 aus wie einfach nur height:400px;)

Habe hier also das Problem, daß ich CSS2 vor CSS2fähigen Browsern verstecken will, was wohl kaum gehen dürfte. Oder kann man die height-Angabe irgendwie via CSS2 "löschen", als wäre sie nie auf 400px gesetzt worden? Das wäre am besten. Dann könnte man so vorgehen:

.haupt {
  height:400px;
}

body > .haupt {
  height:LOESCHEN();
  min-height:400px;
}

(Die ganzen alten Tricks wie transparente Dummygrafiken, Tabellenzellen mit height-Attributen sind wegen der o.g. Nebenbedingungen sowieso tabu.)

Da das doch bestimmt ein ziemlich gängiges Problem ist, wird doch bestimmt jemand ne perfekte Lösung in der Schublade haben, oder?

Gruß,
apstrakt

  1. Hallo,

    Da das doch bestimmt ein ziemlich gängiges Problem ist,

    Meinst du?

    wird doch bestimmt jemand ne perfekte Lösung in der Schub/lade haben, oder?

    Aber sicher.

    Grüße
    Thomas

    PS: ich kapier's nicht, keiner will hier überhaupt etwas noch selber machen?!?!

    1. PS: ich kapier's nicht, keiner will hier überhaupt etwas noch selber machen?!?!

      ach, thomas, so ist das nu auch wieder nicht. den ganzen tag über wird hier fleißig gecodet. aber gerade weil mir das problem so trivial erscheint, dachte ich, ein brett vor'm kopf zu haben und daß mir jemand ne simple lösung anbieten kann, weil alle lösungsansätze, mit denen ich es versuche, nicht zum gewünschten ziel führen.

      gruß,
      a.

    2. PS: ich kapier's nicht, keiner will hier überhaupt etwas noch selber machen?!?!

      jetzt ist mir doch selbst ne lösung eingefallen: einfach mit conditional comments den sonderfall MSIE abhandeln. ist zwar dreckig, aber letztlich den anforderungen adäquat.

      gruß,
      apstrakt :)

  2. (Die ganzen alten Tricks wie transparente Dummygrafiken, sind wegen der o.g. Nebenbedingungen sowieso tabu.)

    Was ist an Dummygrafiken in so einem Fall nicht HTML- oder CSS-Komform?

    <div>
    <img style="float:left;height:400px;width:1px; src="tranparent.gif">
    Der Inhalt
    </div>

    Thomas

    1. Was ist an Dummygrafiken in so einem Fall nicht HTML- oder CSS-Komform?

      das problem mit solchen dummygrafiken ist, daß sie keinerlei informationsgehalt besitzen und daher wenig behindertengerecht sind. schau dir mal ne seite mit abstanderzeugenden dummygrafiken auf einem reinen textbrowser wie lynx an. der anspruch ist halt hoch: eine standardkonforme barrierefreie website, die trotzem "normalen" designansprüchen genügt. wenn man es allen recht machen will...

      gruß,
      a.