左边和右边的div边界居中布局（带bg图像）（drupal）

Question

我已经开始使用Boilerplate主题在drupal上创建新主题。 我正试图在左右两边都实现一个居中的（响应宽度）布局。我附上了一张图。 DIAGRAM HERE

我的左侧边框工作正常，它们在#PAGE div内，它是所有内容中唯一的WRAPPER。 （上面没有其他div）

正如我在图中显示的那样，我遇到了右侧边界的问题。使用与左边框相同的CSS语法，即使它们位于#PAGE div内，也可以看到它们位于最右边。为什么是这样？为什么#PAGE div不能把它拉在一起？

感谢您的帮助！

编辑 codejsFiddle demo/mockup

PS-这些边界需要举行图像作为背景，所以我不能简单地用“边界”属性。而“边界形象”并没有得到很好的支持。 DIV是我需要的。

Answer 1

你的右边框有“position：fixed”，这意味着它的位置是相对于视口而不是HTML内容的。所以用

right:0 

...它将被推到浏览器窗口的右边缘（从窗口右侧0像素）。你需要保持它正常的流量（所以避免位置固定或绝对，使用相对）。

你也会陷入困境，以便用固定的边界进行响应。

查看https://developer.mozilla.org/en-US/docs/Web/CSS/position了解更多信息。

您还可以尝试使用css边框属性执行此操作：https://developer.mozilla.org/en-US/docs/Web/CSS/border。

祝你好运。