我是css的新手，需要一些建议。我有DIV的网页内容有固定宽度（1140像素）和绿色背景，中间位于中间。
{position: relative; width: 1140px; height: 2000px; top: 0px; z-index:1; margin: 0px auto }
我现在想要实现的是两侧的两个div，它们只包含淡入白色的网页颜色。因此屏幕的边界是白色的，并且它与中央div相遇的地方是绿色。我知道线性梯度属性。问题是我不知道这些DIV会有多宽。有没有办法让它们相对于中央DIV，所以它们将整个剩余空间填满到一边或者我必须计算它？
有人对此有简单而优雅的答案吗？
非常感谢
答案 0 :(得分：0)
比这个zigzag
好这样做的一种方法是使用 js 和我猜css可以做到。
试试这个：
<script>
document.getElementById("yourDivId").width = (window.innerWidth - 1140)/2
</script>
N.B：别忘了把这段代码放在div
之后答案 1 :(得分：0)
是的，有一种方法可以填满剩下的空间。您可以使用calc在css中进行简单的计算，并且有一个度量单位vw可以为此非常方便。
100 vw =视口宽度的100％
所以如果你知道你的中心div总是1140像素，你可以很容易地计算出这边的div的宽度：
width: calc((100vw - 1140px)/2);
现在浏览器支持应该相当不错：
一方面，考虑使用伪元素:after和:before而不是仅仅为样式添加额外的div，这被认为是不好的做法。您应该仅为样式添加标记。
我将如何做的小演示： http://jsfiddle.net/669t4s3L/