多列CSS最小高度100％

Question

我跟着這個guide來幫助設置我的頁面的列。

我想要做的是讓我的列填充屏幕，如果屏幕大於內容，但是當內容長於瀏覽器屏幕可以立即顯示時，使用默認溢出滾動或汽車。

目前，我有身體，我的容器（文章中描述的容器周圍的div）以及文章中描述的容器設置爲高度：100％。當頁面適合所有的內容時這很好，但是當屏幕太小時，內容就會被切斷。

我試圖通過將主體或我的容器更改爲最小高度到100％來解決此問題，儘管這會使較小的屏幕再次顯示一切，但在較大的屏幕中，2列「背景」不會延伸到底部的頁面，但我的容器呢。

編輯：我的HTML和body也設置爲當前高度100％。

EDIT2：這裏有一個jsfiddle東西它看起來當含量大於屏幕

更大的像現在的結構是一樣的東西：

body (height: 100%) 
    my_container (height: 100%) 
     container2 (height: 100%) 
      container1 (height: 100%) 
       column1 
       column2 

我想它做的東西像

body 
    my_container (min-height: 100%) 
     container2 (height: 100%) 
      container1 (height: 100%) 
       column1 
       column2 

Answer 1

只是刪除身高：100％;從你的CSS。

http://jsfiddle.net/8DNmh/2/