划分100％宽度和边距

Question

我正在尝试将左右边距放在也是100％宽度的东西上。我正在使用盒子大小调整方法，我希望它能说100％包括边距，但它确实100％加上边距，这意味着我有一个垂直滚动条。

这里有证明：

http://jsbin.com/xomocitono/1

  <div id="main">
    Test
  </div>

#main {width: 100%; margin-left: 100px; margin-right: 100px; background: red;}

在我自己的特殊情况下，我不能使用以下内容：

1. 改为填充，因为即使它按照我想要的方式工作（以100％宽度表示），填充也会覆盖下面的链接，而边距则不会。

2. CSS Calc（它不像我希望的那样是跨浏览器）

3. 固定宽度#main，因为我希望它是流畅的，只是边缘两边。

我还有其他选择吗？

Answer 1

当您使用 margin-left 和 margin-right 时，您不必提供宽度。

试试这个：

#main
{
 margin-left: 10%;
 margin-right: 10%;
 background: red;
}