HTML CSS body autosizing

나는이 유형의 것에 대해 많은 질문을하지만, 나는 나의 질문에 답하는 사람을 찾지 못했다.

특정 기준에 따라 게시물을 필터링 할 수있는 "뉴스 피드"형식의 사이트가 있습니다. 따라서 일부 필터를 사용하면 브라우저 창보다 훨씬 큰 컨텐츠를 얻을 수 있습니다. 다른 필터를 사용하면 콘텐츠를 얻을 수 없습니다.HTML CSS body autosizing

웹킷의 웹 검사기를 사용할 때 html {min-height:100%}은 <html> 태그의 트릭을 수행합니다. <body>이 정확히 똑같은 일을하고 싶습니다. 콘텐츠가 페이지에 맞으면 100 %가되고 그렇지 않은 경우 확장됩니다.

그러나 신장이 <html>으로 설정되지 않은 경우 신체에 백분율 height 또는 min-height을 사용할 수 없습니다. 그것의 백분율을 기준으로 높이를 상속받지 않습니다. 따라서 문서의 내용이 전체 창보다 작을 때 결국 나는 모든 것을 덮어 씌우는 것이고 내용의 기초는 내 배경과 물건을 망칠 것입니다.

아이디어가 있으십니까?

html,body{ height: 100%; }

그리고 난 당신의 배경이 body 태그에 있다고 추측하고있다 : 당신이 필요로하는 모든 추가하는 것처럼 소리가 제한된 사항에서

출처

2012-03-19 Andrew

을 발행하고 의 높이를 설정할 수없는 이유는 무엇입니까? –

그 이유는 내용이 브라우저 창보다 클 때 모든 내용의 맨 아래로 확장되지 않기 때문입니다. – Andrew

그런 경우 오버플로를 자동으로 설정합니다. –

은 어쩌면 당신은 이런 식으로 뭔가를 시도 할 수 있습니다 : 나는 희망

html { 
    height: 100%; 
} 
body { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
} 
#content { 
    min-height: 100%; 
}

이이를 해결하는 데 도움을

출처

2012-03-19 15:17:11 davorivas

이다.

출처

2012-03-19 14:33:52 corymathews

아니요, 브라우저 창 높이에 높이를 유지합니다. 콘텐츠가 창 한 페이지를 지나갈 때 좋지 않습니다. 몸은 회색 배경을 가지고 있으며, 모든 내용이 들어간 흰색 div가 있습니다. 문제는 div는 신체만큼 커야 만한다는 것입니다. – Andrew

나의 제안은 몸의 높이를 100 %로 설정하는 것입니다. 100 %는 부모 요소와 마찬가지로 많은 공간을 가져야 함을 의미합니다. 그래서, 당신의 HTML 태그가 그냥 body 태그는 같은 크기 취할 수 있도록되어 있는지 않는 경우 :

<html style="min-height: 100%"> 
<body style="height: 100%"> 
</body> 
</html>

출처

2012-03-19 14:36:38 devsnd

body 요소는 최소 높이가 아니라 html에 지정된 높이가없는 한 백분율을 무시하는 것으로 보입니다. – Andrew

HTML CSS body autosizing

답변

관련 문제