Höhe 100% auf html und Körper

setzen

Ich habe ein Problem, wenn ich Höhe 100% auf HTML, Körper und den Container, der alle anderen Elemente enthält setzen.Höhe 100% auf html und Körper

Wenn ich das Developer Tool des Browsers verwende, sehe ich die Höhe des HTML und Body sind nicht 100%. Kann mir jemand sagen, was passiert ist?

<html style="height: 100%;"> 
    <head></head> 
     <body style="height: 100%; background: #000;"> 
      <div class="container" style="height: 100%; margin: 0 30px; background: #ccc;"> 
       <div style="min-height: 100%; text-align: center; font-size: 40px; line-height: 40px; color: #FFFFFF;">A</div> 
       <div style="min-height: 100%; text-align: center; font-size: 40px; line-height: 40px; color: #FFFFFF;">B</div> 
       <div style="min-height: 100%; text-align: center; font-size: 40px; line-height: 40px; color: #FFFFFF;">C</div> 
     </div> 
    </body> 
</html>

Quelle

2017-01-04 hayley

Was erwarten Sie passieren? Sie haben drei Divs mit (mindestens) 100% Höhe platziert - sie müssen sie irgendwo platzieren. –

@torazaburo Ich möchte den Hintergrund des Containers festlegen. Alle Kinder Div sollten Gary sein, nicht wahr? – hayley

Meine schnelle Schätzung: Ich denke, dass Sie stattdessen 100vh verwenden möchten. Oder absolute Positionierung. 100% Höhe auf einem Div ist nicht dasselbe wie 100% Höhe seines Elternteils. – RMo

Sie sollten CSS-Positionierung gelten 100% Höhe zu erhalten, versuchen CSS-Code folgende:

<body style="position:absolute; width:100%; height:100%; left:0; top:0; background-color:#f00; padding:0; margin:0;">

Quelle

2017-01-04 07:02:00 Hanif

Oft gibt es einen Spielraum für den Körper aufgenommen haben, müssen Sie es manuell mit entfernen:

<body style="height: 100%; background: #000; margin: 0; padding: 0">

Quelle

2017-01-04 07:06:34

Höhe eines Blockelements kann festgelegt werden, es sei denn, es ist in einem anderen 100% Höhe div enthalten. Für absolute Browser-Unterstützung verwenden Sie besser 6-stellige Farbcodes. Versuchen Sie, diese und teilen Sie das Ergebnis bitte:

html, body { 
    height: 100%; 
    margin: 0; 
    padding: 0; 
    background-color: #000000; 
}

Quelle

2017-01-04 07:19:18

Verwenden jQuery dies zu tun:

$(window).load(function() { 
    var windowHeight = $(window).height(); // get window height 
    $('html, body').height(windowHeight); // set window height to html & body 
})

Quelle

2017-01-04 07:57:23

Höhe 100% auf html und Körper

Antwort

Verwandte Themen