CSS와 함께 강 도시의 문제

Question

좋아 여기 사이트가 있습니다.

http://danberinger.com/

HTML 및 CSS의 소스를 보면 DIV의 높이를 중간에서 100%로 설정하고 HIDDEN의 오버 플로우 속성 값을 주었음을 알 수 있습니다. "main_Content"라고합니다. 높이 값이 표시되는 내용에 영향을 미치지 않는다는 것을 깨달았습니다. 배경색을 유지하면서 각 페이지에서 가변 DIV 높이를 달성하는 가장 좋은 방법이 무엇인지 궁금합니다. 나는 이것을 올바른 방법으로하고 있습니까? 아니면 올바른 방법이 아닌 일종의 CSS 해킹을 사용하고 있습니다. 모든 통찰력은 환영합니다. 저에게 답변을하기 전에 소스 HTML 및 CSS를 살펴보십시오.

Answer 1

가장 쉬운 솔루션은 배경색을 귀하에게 할당하는 것입니다. body 요소. 이 같은:

body {
 margin: 0;
 padding: 0;
 width:100%;
 height:100%;
 background-color:#cccccc;
}

이것은 또한 가장자리 주위에 몇 개의 픽셀 흰색 테두리를 제거 할 것입니다. margin 그리고 padding 선언.

Answer 2

나는 당신이 원하는 것을 오해했을지 모르지만 이것을 시도하십시오.

div#intro_container를 다음과 같이 교체하십시오.

div#intro_container {
width:830px;
margin:auto;
overflow: hidden;
background-color:#333333;
}

Div#MessageBox에서 높이 속성을 제거하십시오.

Answer 3

나는 이런 식으로하는 것을 선호합니다.

Div 'Main-Content'의 내용에서 추가

당신의 경우에는 그랬습니다

<div id="main_content">
    <div id="navigation">..</div>
    <div id="intro_container">..</div>
</div>

그것은 캠으로 다시 작성됩니다

<div id="main_content">
    <div id="navigation">..</div>
    <div id="intro_container">..</div>
    <div style="clear:both"></div>
</div>

Afaik 이것은 당신이하고있는 일을 달성하는 표준 방법입니다.