頁顯示滾動條無論什麼

這裏是我的網頁：http://bad-sf.com/stemtest/about.html 頁顯示滾動條無論什麼

注意滾動仍然是，即使內容是足夠小，不需要滾動的選項。它可能與我的CSS有關嗎？（以下）：

body:before { 
content:""; 
height:100%; 
float:left; 
width:0; 
margin-top:-32767px; 
} 
* { 
margin:0; 
padding:0; 
outline: none; 
} 
html, body { 
height:100%; 
font-family: '_.regular'; 
font-size: 13px; 
outline: none; 
} 
#wrap { 
min-height:100%; 
width:800px; 
margin: 2% auto; 
} 
#main { 
overflow:auto; 
padding-bottom: 30px; 
} 
#smm { 
width: 400px; 
height: 200px; 
float:left; 
} 

#footer { 
position: relative; 
margin-top: 0px; 
height: 35px; 
clear:both; 
font-family: '_.regular'; 
}

謝謝！我仍然在學習HTML和CSS，所以你有任何輸入將非常感激 - 丹尼

來源

2012-12-06 BottleRockets

拿走height:100%;從html, body { }。無論如何，你爲什麼還需要它？

滾動條始終出現的原因是因爲#wrap DIV也設置爲100％高度，並且最高爲2％。這迫使你的身體比100％多出2％。

您可以從#wrap中刪除2％的保證金，但如果您不想要這樣做，則從html, body { }中刪除height: 100%;應該有所斬斷。

來源

2012-12-06 08:02:50 mushroom

這個答案應該從一開始就接受。我不明白downvote。看到另一個正確的答案是如何被低估和隨後刪除的，我甚至不會打擾問爲什麼...... – mingos

這是由#wrap造成的，高度爲104％。請注意以下規則：

body { 
    height: 100%; 
} 
#wrap { 
    min-height: 100%; 
    margin: 2% auto; 
}

所以你#wrap實際上是100％高度加上2％的保證金上底部頂部加2％的保證金。

有幾種方法可以解決這個問題。

您可以從#wrap刪除body的height和可選min-height，因爲它是在這種情況下沒有用了。

您可以將#wrap上的margin更改爲margin: 0 auto;（這將不可避免地提高內容）。

可能還有一些其他的可能性，但當看到不滿意的答案被拒絕時，我並不覺得有必要考慮更多的崇高解決方案。

來源

2012-12-06 08:33:00 mingos

從'＃wrap'中刪除'min-height'仍然會顯示滾動條。 – mushroom

沒錯。我編輯了答案。 – mingos

謝謝！像魅力一樣工作。這麼做很簡單，但我很難理解這麼多因素在起作用...... – BottleRockets

頁顯示滾動條無論什麼

回答

相關問題