當我最小化一個瀏覽器,水平地說,和theres溢出我的頁面有問題。當我從最小化滾動到隱藏部分時,整個頁面部分都是空白的。當瀏覽器最小化,滾動時有一個空白空間
有誰知道爲什麼會發生這種情況?我已將div設置爲一定的高度(即900px,而不是百分比)?
當我最小化一個瀏覽器,水平地說,和theres溢出我的頁面有問題。當我從最小化滾動到隱藏部分時,整個頁面部分都是空白的。當瀏覽器最小化,滾動時有一個空白空間
有誰知道爲什麼會發生這種情況?我已將div設置爲一定的高度(即900px,而不是百分比)?
從您的評論,這可能是你的問題;你的固定寬度。嘗試用max-width
代替width
。
max-width
將表現大致相同width
而包含的元素是寬或更寬,但將允許div
到時,它變得比設置的寬度收縮。有一個簡單的例子here。拉伸並調整右下方的面板以查看其實際效果。如果這不起作用,我們需要在JSFiddle上看到頁面鏈接或演示。
這裏是你的解決方案:
CSS
.wrapper {
display: block;
width: 100%;
padding: 10px 0; /* add some top + bottom padding */
background-color: #252525;
}
.aligner {
display: block;
width: 960px; /* site width */
margin: 0 auto;
}
.container {
display: inline-block;
}
HTML
<div class="wrapper">
<div class="aligner">
<div class="container">
// stuff
</div><!-- /container -->
</div><!-- /aligner -->
</div><!-- /wrapper -->
這不是最漂亮的,但它可以讓你扔100%的寬度背景 - 顏色在任何部分,並在< IE8中工作。你可以在div.container
(float,position等)中做任何你需要的東西,它會擴展.wrapper元素(從而垂直擴展你的背景顏色)。由於背景顏色應用於寬度爲100%的包裝,因此您不會在右側遇到空白區域。
每個div.wrapper
應被視爲一個「節」 - 「頁眉」,「功能」,「內容」,「頁腳」,等等......
這真的很難說沒有標記/ css和(* *還**)示範。 –
瀏覽器需要多少才能發生這種溢出? – Bojangles
我有一噸的CSS,它看起來像沒有任何通常會導致此問題。我只是想知道如果有人遇到過這個溢出問題或者不是。 @JamWaffles:當它達到我的設置寬度時開始發生; – hellomello