javascript - 我需要一个 div 从页面右侧的 0 自动边距 div 的右侧填充

Question

我有一个 950 像素的主要内容 div，并且自动边距为 0，因此它居中。它里面有透明的内容，所以不能有背景颜色，但我需要左右边距才能有背景颜色。是否可以将 div 放置在 div 的绝对右侧并拉伸到窗口的末尾？我可以在左边通过给它一个负的绝对值来做到这一点，但在右边它会滚动到 div 的末尾。

.mainwrapper {width:950px; margin:0 auto; height:800px; position:relative;}
.leftmargin {height:800px;width:1000px;position:absolute;top:0px;left:-1000px;}
.rightmargin {height:800px;width:1000px;position:absolute;top:0px;left:950px;}

HTML
<div class="mainwrapper">
<div class="leftmargin"></div>
<div class="rightmargin"></div>
</div>

有没有一种简单的方法可以做到这一点或只有javascript？

Answer 1

这应该不难解决，但您需要访问.mainwrapper' 父级。

HTML：

<div class="outer">
    <div class="mainwrapper">
        <div class="leftmargin"></div>
        <div class="rightmargin"></div>
    </div>
</div>

CSS：

.outer {
    overflow-x: hidden;
}
.mainwrapper {
    width:950px;
    margin:0 auto;
    height:800px;
    position:relative;
}
.leftmargin {
    height:100%;
    width:99999px;
    position:absolute;
    left:100%;
}
.rightmargin {
    height:100%;
    width:99999px;
    position:absolute;
    right:100%;
}