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

Question

下面的這個div導致頁面在小於1450像素的瀏覽器上水平滾動。 我以為溢出會解決此問題，但似乎不會...可能是我需要在父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以便垂直滾動條不會消失。 另外，清除overflow: hidden; 來自#Header 。

Answer 3

看起來您想要三件事：

1. 標題圖像被剪切時沒有滾動條。
2. 切斷主頁內容后，滾動條為是。
3. 如果瀏覽器窗口較寬，則標題背景的功能可以向右擴展。

您確實需要在此處發布更多相關代碼。 但是，我查看了您的網站，此問題將得到解決：

1. 更改#outer的規則：

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

1. 從#outer的父項中刪除邊距和寬度規則，並替換為width:100%;overflow-x:hidden;