html - 超出水平滚动范围的区域设置为主体颜色

Question

我是 HTML/CSS 的新手。我希望屏幕的水平条在红色背景上是黑色的。使用 CSS，我定义了一个黑色背景的包装器和一个红色背景的主体。

不幸的是，当有一个水平滚动条时，包装器只占据页面的最左边滚动条可以看到的部分。页面右侧的区域完全是红色的。

以下是相关的 HTML 和 CSS：

<div id="wrapper">
    <div id="page" class="container">
        <div id="content">
            <h2 class="title">Foo</h2>
            <div class="Body">
                <p>Bar</p>
            </div>
        </div>
     </div>
</div>



#wrapper {
    background-color: #000000;
}

.container {
    width: 1000px;
    margin: 0px auto;
}

#page {
    padding-top: 280px;
}

#content {
    float: left;
    width: 620px;
    padding-right: 40px;
}

body {
    margin: 0;
    background: #FF0000;
}

Answer 1

您需要指定 div #wrapper 的最小宽度

#wrapper {
          min-width: 1000px;
         }