html - 强制 Div 宽度大于 Margin-auto 宽度

Question

您好，我有一条线要放在我的网站上。虽然我已经尝试了一些东西，比如 z-index，position: fixed 等。我似乎无法让这条线跨越整个浏览器长度，同时网站的边距自动宽度仍然为 900px；。无论如何，他们是否要“覆盖” 900 的边距宽度，并使该行在静态时跨越整个网站。我也试过从 body 标签中取出 div，但似乎也没有用。

.line {
    position: static;
    background-color: #d1d1d1;
    width: 100%;
    height: 1px;
    margin-top: 20px;
}

 body {
 margin: 0px;
 padding: 0px;
 margin: 0 auto;
 width: 900px;
}

Answer 1

如果线条是你 body 的一部分，那么 width:100% 将使它成为 900px(你在 body 上设置的宽度)

他们的方法是将正文宽度设置为 100%，然后为您的主要内容创建一个包装器(宽度为 900 像素)，并为整个宽度的行创建一个单独的行 div。

添加了一个 fiddle :http://jsfiddle.net/xrqezvxz/

你的 CSS 应该是这样的:

 body {
     margin: 0px;
     padding: 0px;
     width: 100%;
    min-height:500px;
}

.line {
    position: fixed;
    background-color: #d1d1d1;
    width: 100%;
    height: 5px;
    margin-top: 20px;
}

.content_wrapper
{
    width:900px;
    background-color:red;
    min-height:500px;
    height:500px;
    margin:0 auto;
}