頁腳粘在底部問題

這並沒有爲我工作。我所看到的問題是，在我的身體HTML CSS中，我確實設置了100％的高度，但它並沒有真正將其設置爲100％。

這裏是我的頁腳和身體，我的HTML CSS代碼：

body { 
font-family: 'AG-Regular', Helvetica, Arial, sans-serif; 
margin: 0; 
min-width: 1058px; 
} 

body, html { 
height:100% !important; 
} 

#footerBox { 
    width: 100%; 
height:218px; 
background-image:url(/img/footer-bg.png); 
background-attachment:scroll; 
background-repeat:repeat-x; 
}

Here is a link to the site。

你應該看看它在哪裏搞砸了。任何幫助將是欣賞。謝謝。

來源

2013-03-27 Alex Kittavong

您是否試圖將表單附加到底部的白色條上？ – David 2013-03-27 14:44:30

我試圖完全隱藏底部的白色條紋。我只是希望頁腳能夠堅持到紅色背景的底部。 – 2013-03-27 14:45:56

我剛剛更新了一點CSS。假設使用#mainBox時，我使用了#footerBox分類的#pushBox。那種東西固定了它，我仍然在底部有白色條紋。 – 2013-03-27 14:49:05

主要問題是-218px margin-bottom在#maincontent。製作此218px，以便您的頁腳被按下。我將頁腳設置爲始終位於頁面底部，使用position: fixed，不確定這是否是您想要的。

#footerBox { 
width: 100%; 
height: 218px; 
background-image: url(/img/footer-bg.png); 
background-attachment: scroll; 
background-repeat: repeat-x; 
position: fixed; 
bottom: 0; 
} 
#mainBox #mainContent { 
background-color: white; 
margin: 185px auto 218px; 
overflow: auto; 
padding: 30px 20px 20px; 
width: 958px; 
}

來源

2013-03-27 15:03:46 gaynorvader

謝謝，我現在就試試看。 – 2013-03-27 15:05:52

非常接近我正在尋找的東西，除非我不希望頁腳瀏覽像這樣的內容。不像導航菜單。 – 2013-03-27 15:09:53

要讓頁眉和頁腳粘住，您需要使用位置：固定在兩者上。

示例代碼

部首

#headerBox 
{ 
    position: fixed; 
    height: 200px; 
    left: 0; 
    top: 0; 
    width: 100%; 
}

主

#mainBox 
{ 
    overflow: auto; 
}

頁腳

#footerBox 
{ 
    postion: fixed; 
    height: 218px; 
    width: 100%; 
    bottom: 0; 
    left: 0; 
}

來源

2013-03-27 15:11:56

頁腳粘在底部問題

回答

相關問題