Verschachtelte Divs mit Mindesthöhe von 100% erzwingen?

Ich weiß, dass min-height: 100% funktioniert nur um mindestens 100% der Höhe des übergeordneten Elements zu übernehmen, wenn das übergeordnete Element einen numerischen Wert für Höhe hat, aber was ist, wenn ich ein paar verschachtelte divs habe und ich möchte, dass alle ein haben Mindesthöhe von 100%? Ich habe versucht min-height:inherit, aber das hat auch nicht funktioniert? Ich weiß, dass ich dieses Problem wahrscheinlich mit JavaScript lösen kann, indem ich einfach den Wert für die Browserhöhe beim Laden von Dokumenten überprüfe und das dann der min-height -Eigenschaft meiner geschachtelten divs zuweise, aber ich würde gerne wissen, ob es möglich ist, das zu lösen mit nur CSS?Verschachtelte Divs mit Mindesthöhe von 100% erzwingen?

Edit: Ich sollte auch erwähnen, dass ich meine äußerste div und meine verschachtelten divs alle eine Mindesthöhe von 100% haben müssen, so dass sie mindestens die Höhe des Browsers aufnehmen, aber erweitern, wenn nötig .

Quelle

2012-08-11 hesson

min-height: inherit; funktionieren sollte: http://jsfiddle.net/ugxbs/

EDIT

Was Prozentwerte und das erwartete Verhalten, gibt es keine Logik hinter verschachtelten min-height. Was Sie tun sollten, ist, die height Eigenschaft für alle Eltern zu verwenden, dann fügen Sie Min-Höhe zu den innersten DIV hinzu.

f.ex:

<html> 
    <body> 
     <div class="outer"> 
      <div class="inner"></div> 
     </div> 
    </body> 
</html>

CSS:

html, body, .outer { height: 100% } 
.inner { min-height: 100%; }

http://jsfiddle.net/4PsdT/

Auf diese Weise werden Sie den Browser sagen, alle äußeren Elemente von oben zu setzen (HTML) auf ein Höhe von 100%. Dadurch werden diese Elemente über die Browserhöhe gestreckt. Fügen Sie dann einfach ein min-height zum innersten Element hinzu, das den Inhalt enthält.

Die Einstellung height bedeutet nicht, dass der übermäßige Inhalt von Kindern ausfällt, es sei denn, Sie fügen overflow:hidden; hinzu.

Quelle

2012-08-11 18:29:01 David

Ich weiß, dass es funktionieren würde, wenn die äußere meisten div einen numerischen Wert für min-height hat, aber es wird scheitern, wenn die äußere meisten div einen Prozentsatz für min-height hat (das ist, was ich brauche in mein Fall). Ich brauche alle meine verschachtelten Divs, um wenigstens die Höhe des Browserfensters zu erreichen, also sollte mein äußerster Div-Wert eine Mindesthöhe von 100% haben, es sei denn, es gibt eine andere Möglichkeit, dieses Problem zu lösen. – hesson

@hesson Siehe meine Bearbeitung für einen Versuch zu erklären, warum verschachtelte Min-Höhe keine logische Annäherung an das Problem ist. – David

Perfekt, genau das habe ich gebraucht! – hesson

Ich kann es mit der Eigenschaft Höhe aber nicht Min-Höhe arbeiten lassen.

http://jsfiddle.net/zDVqm/

Quelle

2012-08-14 07:36:14 LeBen

Verschachtelte Divs mit Mindesthöhe von 100% erzwingen?

Antwort

Verwandte Themen