배경에서 최소 높이가 작동하지 않는 이유는 무엇입니까?

Question

div 클래스에 배경을 추가했습니다. 내가 원했던 것은 이미지 높이가 항상 브라우저 높이와 같은 높이를 가졌기 때문에 최소 높이 = 100 %로 달성하려했습니다. 나는 그것이 작동하도록하지 않습니다 .. 어떤 제안?

HTML :

<div id="top" class="jumbotron"> 
</div> 

CSS :

.jumbotron { 
    background: no-repeat center center url('top.jpg'); 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    min-height: 100%; 
    margin: 0px; 
} 

Answer 1

몸과 html로는 100 % 높이를 채울 수 있습니다

html, body { 
    height: 100% 
} 

Answer 2

이 대형 기기 클래스에이 추가하기 :

min-height: 100vh; 

작업 바이올린 : https://jsfiddle.net/dgo3sz0a/