網站頁腳在較小的屏幕上重疊頁面內容

Question

Our company website在最初設計的大屏幕尺寸（1920x1080 21.5「屏幕）下看起來很好;但是當在較小的屏幕尺寸（即15」筆記本電腦或移動設備） ，頁腳會重疊內容以適應瀏覽器窗口的底部。

我跟着粘腳註冊教程，它似乎並沒有工作。頁腳下方還有額外的空白，導致出現y-scrollbar。

Answer 1

不要使用position：absolute;爲內容。使用位置：相對;而不是

<style type="text/css"> 
html, body 
{ 
    height: 99%; 
    background-color:Black; 
} 
.header 
{ 
    width: 960px; 
    height: 15%; 
    background-color:Gray; 
} 
#Content 
{ 
    min-height: 85%; 
    width: 960px; 
    background-color:Navy; 
} 
.con 
{ 
    min-height:900px; 
    width:960px; 
    background-color:Aqua; 
} 

和

<div class="header"> 
    </div> 
    <div id="Content"> 
    <div class="con"></div> 
    </div> 
    <div class="header"> 
    </div>