CSS 떠 다니는 DIV가 창 높이로 늘어납니다.

Question

CSS를 처음 접했을 때 나이가 들었습니다. 나는 구석에 몸을 맡겼습니다.

나는이와 3 열 부동 레이아웃을 만들었습니다

* { 
    margin: 0; 
    padding: 0; 
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif; 
} 

    #wrapper { 
     width: 960px; 
     background: silver; 
     margin: 0 auto; 
    } 

#column-left { 
    width: 240px; 
    float: left; 
    background: #f4d2d4; 
    padding-top: 36px; 
} 

#column-center { 
    margin-top: 41px; 
    margin-left: 34px; 
    margin-right: 34px; 
    width: 492px; 
    float: left; 
    background: white; 
} 

#column-right { 
    width: 160px; 
    float: left; 
    background: white; 
    margin-top: 49px; 
} 

왼쪽 열을, 당신이 볼 수 있듯이, 컬러 배경이있다. 그러나 그것은 페이지의 맨 아래로 뻗어 있지 않고 단지 내용을 덮기 위해서입니다. 그리고 나는 그것이 줄곧 아래로 뻗기를 필요로한다.

절대 또는 고정 나사의 위치를 ​​3 열 레이아웃으로 바꿉니다. 높이 사용하기 : 100 %는 몸 전체로 되돌아 가야하며, 모든 것이 완전히 엉망이됩니다. 이 문제를 쉽게 해결할 수 있습니까?

Answer 1

Dan Cederholm은 "가짜 열"기술을 사용하여 열이 확장되는 것처럼 보이게 만드는 좋은 방법이 있습니다. 오히려 그것을 다시 쓰기보다, 나는 여기에 연결합니다 :

http://www.alistapart.com/articles/fauxcolumns/

크리스 Coyier 또한 당신이 이제까지 유체 레이아웃을 사용하기로 결정하면 다른 사람들이이 문제를 해결 한 방법의 좋은 쓰기까지 있습니다

를

http://css-tricks.com/fluid-width-equal-height-columns/

Answer 2

height:100%부터 body, html 및 열을 추가하십시오.