定義的寬度div導致頁面水平滾動

Question

下面的div引起頁面在小於1450px的瀏覽器上水平滾動。我認爲溢出會解決這個問題，但似乎沒有...可能是我需要做的父div的東西。有任何想法嗎？

http://barr-display.mybigcommerce.com/

#Header { 
    position: relative; 
    clear: both; 
    width: 1450px; 
    min-height: 190px; 
    overflow: hidden; 
    background: url('/content/headerbg3.jpg') repeat-x; 
    } 

Answer 1

在體必須滿足下列條件

body { 
    width:100%; 
    overflow:hidden; 
} 

你的代碼是不工作的原因是，你對孩子（#header）設置overflow當它需要設置在父母身上。

Answer 2

這些行添加到你的CSS：

html, body { 
    width:100%; 
} 
body { 
    overflow-x:hidden; 
} 

您需要overflow-x所以垂直滾動條沒有消失。 另外，從#Header刪除overflow: hidden;。

Answer 3

看起來你想要三樣東西：

1. 沒有滾動條時，標題圖片被切斷。
2. 是當主頁面內容被切斷時用於滾動條。
3. 如果瀏覽器窗口很寬，則可以將頁眉背景擴展到右側。

你真的需要在這裏發佈更多的相關代碼。不過，我看你的網站，這會解決它：

1. 更改規則#outer：

#Outer { clear: both; margin: 0 auto; min-height: 190px; width: 1024px; }

1. 從＃外的拆除保證金和寬度規則親代，並用width:100%;overflow-x:hidden;代替