Twitter bootstrap 在使用bootstrap responsive调整大小期间，如何将容器或主体填充保持在5px？

我正在修改此布局，在调整大小期间，似乎无法使容器左侧、右侧和顶部的间隙/填充保持在5px。在任何屏幕大小下，当前的填充看起来都在20px左右

这给了我所需要的，直到我得到一个更小的尺寸。我不知道它在什么屏幕大小的变化。它大约是铬的第二个转变。当我达到那个小尺寸后，它又恢复到上面例子中较大的间隙

body {
  padding-top: 45px;
  padding-bottom: 40px;
}
.cont-pad {
  padding-left:5px;
  padding-right:5px;
}
.container {
  padding-left:5px;
  padding-right:5px;
}
.container-fluid {
   padding-left:5px;
   padding-right:5px;
}

我使用这个作为示例中的html布局。这些颜色可以直观地看到容器在调整大小时是如何填充的。从我所做的修改中我注意到的一点是，最外层容器的宽度似乎是从浏览器的侧面填充的，而不是调整大小后div本身的填充。更改body标记上的左右填充也会更改我的导航栏的填充。这是我不想要的

<div class="container-fluid cont-pad" style="background-color:Blue;">
  <div class="row-fluid">
    <div class="span12" style="background-color:Red;">this content should be 5px from left, top, and right</div>
  </div>
</div>

此内容应从左、上、右各5px

---

我想我需要以某种方式修改@media标记。我曾尝试将（最大宽度：980px）更改为5px，但结果是相同的。

我目前正在使用bootstrap responsive 2.3构建一个网站，我只需将其添加到CSS中，即可删除页面的边栏

.container-fluid {
padding-right: 0;
padding-left: 0;
}

我刚刚试过左右填充5px，似乎效果不错

---

您确定没有其他CSS影响您的容器吗

我自己也在努力解决这个问题。Bootstrap对最小尺寸的响应很奇怪，但在其他尺寸上却没有

因此，您正在覆盖容器流体填充，但在小尺寸情况下，bootstrap会将容器流体填充设置为0，并在主体上设置其他填充（默认情况下，设置为与容器流体上的填充完全相同的大小，尽管它在一个位置表示为20px固定，在另一个位置表示为$gutterWidth变量）

我不知道bootstrap为什么会这样做。这太疯狂了。然后，引导程序本身需要它自己的其他解决方法来解决它自己的疯狂问题——例如，在导航栏上进行媒体查询，以补偿并保持导航栏的全宽（即使是小尺寸）

我不确定你想做什么最好的方法，最干净、最有效、最简单的方法。我正试图自己解决这个问题。 您可以尝试将身体上的填充物设置为您想要的小尺寸，而不是引导

@media (max-width: 767px) {

// Padding to set content in a bit
body {
  padding-left: 5px;
  padding-right: 5px;
}

---

当然，现在填充物在身体上，而不是容器液体，这可能会对你的设计产生其他奇怪的影响。我也还在为此挣扎

在我调整页面大小之前，这一直有效。第一个响应过渡将顶部向下，第二个将左右推动。问题是，这些移动的距离与默认响应间隙的长度相同。因此，当调整大小时，它似乎正在恢复到原来的左、上、右间距。我已经尝试了所有方法。我甚至浏览了CSS代码，绕过了每个@media标签。它似乎总是恢复到20px大小。我甚至进行了搜索，并将CSS中的所有20px参数都更改为5px，但它仍然这样做。我仍然在看。你是在看较少的代码，还是呈现的CSS？它可能不是20px参数，可能是$gutterWidth参数。您可能需要将一个类添加到