2011-12-12 4 views
17

나는 컨테이너 DIV에 몇 가지 문제점이있다. 하나는 내 콘텐츠의 높이를 올바르게 인식하지 못합니다 (주 콘텐츠 및 사이드 바 아래쪽으로 확장한다고 생각 했겠지만 그렇지 않습니다). this page에 무슨 뜻인지 알 수 있습니다.컨테이너 DIV의 높이를 창 높이의 100 %로 설정하는 방법은 무엇입니까?

컨테이너 DIV가 화면/창에서 항상 사용 가능한 높이를 채우고 싶습니다. min-height:100%으로 설정하려고 시도했지만 효과가 없습니다.

#container { 
    padding: 0; 
    margin: 0; 
    background-color: #292929; 
    width: 1200px; 
    margin: 0 auto; 
    min-height: 100%; 
} 

내가이 작업을 얻을 수있는 도움에 대한 감사 할 것 : 여기

내가 컨테이너 DIV를 위해 사용하고있는 CSS입니다.

감사합니다,

+0

최신 브라우저 - http://stackoverflow.com/questions/6654958/make-body-have-100-of-the-browser-height/25829844#25829844 –

답변

42

당신의 CSS를이 추가 :

html, body { 
    height:100%; 
} 

당신이 말한다면 높이 : 100 %, 당신은 '부모 요소의 100 %'를 의미한다. 부모 요소에 지정된 높이가 없으면 아무 것도 발생하지 않습니다. 본문에만 100 %를 설정하지만 html에 추가해야합니다.

html, body 
{ 
    height: 100%; 
} 

당신은이 사업부는 모든 공간을 차지 할 수 있어야합니다 :

+0

감사합니다. 그게 내가 알아야 할 것이 었어! – Nick

7

당신이 CSS를 설정했다. :)

4
당신은 높이 볼을 설정 순 수

html, body 
{ 
    height: 100vh; 
} 
2
html { 
    min-height: 100%; 
} 

body { 
    min-height: 100vh; 
} 

height있어 문서의 높이 담당하게 될 것 html height (%)body view height (vh) 소요하면서 screen view100% 이상입니다 화면 높이보다 작은 문서 높이 관리.

+0

질문을 편집하여 설명하십시오. 의미있게 만드십시오. – Suresh

관련 문제