列中有100％的高度在wordpress

如果你去我的網站：website 你看到頂部的黑色線是頭。底部的黑線是頁腳。中間部分是內容，旁邊是我做過的內容欄。現在我想要做的是使頁腳粘到頁面的底部而不顯示滾動條。然後，我正在嘗試將這些列下移到頁腳。但不是通過將分鐘高度改爲更高。我希望列總是去做頁腳。所以列背景將一直到頁腳。列中有100％的高度在wordpress

這裏是我所需要的picture

這裏是我的CSS和HTML

html,body { 
height:100%;} 
body { 
font-family: 'Open Sans', Arial, Helvetica, sans-serif; 
margin:0; 
font-size: 15px; 
font-weight: 400; 
line-height: 157%; 
color: #666666; 
padding:0; 

} 
.content { 
min-height: 0; 
background-color: #9E959E; 
height: calc(100% - 50px); /* add this */ } 

.footer { 
min-height: 25px; 
margin-left: auto; 
margin-right: auto; 
background-color:#000000; 
clear: both; 
position:fixed; 
right:0px; 
left:0px; 
bottom:0px; 
} 

.header { 
min-height:300px; 
background-color:#000000; 
} 
@media only screen and (min-width : 768px) { 
.header { 
    min-height: 25px; 
} 
} 
@media only screen and (min-width : 992px) { 
.header { 
    min-height: 25px; 
} 
} 



<body> 
<div class="header"> 
</div> <div class="content"> 
<div class="page-content"> 
<div class="column_4"></div> 
<div class="column_5"></div> 
<div class="column_6"></div> 
<div class="column_7"></div> 
</div> </div> 
<div class="footer"> 
</div>  <div style="display:none"> 
</div></body>

來源

2015-02-23 user1727251

請刪除jquery標籤，只是做了一個搜索的答案第一 - 我已經找到15個答案，只需在搜索框中輸入'full height column' – 2015-02-23 18:50:26

我昨天做了一整天，我可以得到沒有正確地工作。 – user1727251 2015-02-23 19:03:05

感嘆 - 人們真的不想閱讀 - 爲.page-content添加'height：100％'，併爲每列添加'height：100％' - 將所有列全部設爲'fullHeight'會更容易，並且然後編寫一個單獨的課程 - 您正在使用像Ids – 2015-02-23 19:09:47