Ich versuche, Höhe Eigenschaft mit Prozentangaben verwenden, aber es funktioniert nicht. Ich möchte Prozentsatz verwenden, damit es in jeder Auflösung gut aussieht.Höhe Prozentsatz funktioniert nicht in CSS
<div id="bloque_1" style="height: 80%;background: red">
</div>
Wie kann ich es funktionieren lassen?
Wenn Sieverwenden 210 für Breite oder Höhe, die erste Frage, die Sie fragen sollten, ist das 80% von was? Sie müssen also auch in der Höhe auf das übergeordnete Element anzuwenden, so unter der Annahme, dass dieses Element von Ihnen innerhalb des Body-Tag ist, müssen Sie diese verwenden in Ihrem CSS
html, body {
height: 100%;
}
So, jetzt Ihr div Element 80% von 100% sein
Side Hinweis: auch wenn Sie mit absolute positionierten Elementen zu tun hat, können Sie über ein Szenario kommen, wo Ihre div nicht die aktuelle Darstellungshöhe nicht überschreiten, so dass in diesem Fall müssen Sie min-height
Ich hatte eine Weile mit einem ähnlichen Problem fummelt, Ich hatte Körper auf 100% gesetzt, aber nicht html, danke! –
Alles außerhalb von bloque_1 wird auch eine Höhe benötigen, oder Sie werden 80% von 0. Sie erhalten auch eine Höhe von 100% auf die body gelten müssen.
Hier ist eine jsfiddle, die es in Aktion zeigt.
Nehmen 100% Höhe auf dem übergeordneten Element
HTML Code-
<html>
<body>
<div id="bloque_1" style="height:80%;background:red;width:100%;">
</div>
</body>
</html>
CSS Part-
html, body { height: 100%; width: 100%; margin: 0;background: #3c3c3c }
Arbeits Fiddle - http://jsfiddle.net/SEafD/1/
Demo haben
html,body{
height:100%
}
#bloque_1{
background:red;
height:80%;
}
Höhe Prozentsätze etwas schlampig sind, aber wenn Sie darauf bestehen, werden mit Prozent nehmen nur den Prozentsatz der Höhe des Behälters. Versuchen Sie, {min-height: 100%; } zu Ihrem {body} -Tag. –
min-height doest work = (. Ich habe stattdessen verwendet, Höhe: 100% – Flezcano
Jetzt haben Sie ein Problem, wenn Sie Inhalt Höhe über 100% erweitern müssen. –