使用 Twitter Bootstrap 向容器添加填充答案

【问题标题】：Add a padding to the container with Twitter Bootstrap使用 Twitter Bootstrap 向容器添加填充
【发布时间】：2013-04-26 21:51:57
【问题描述】：

使用 Twitter Bootstrap，我正在寻找一种方法来向页面容器添加左侧内边距或左侧边距。（以页面百分比为单位表示）

事实上，如果我不包含 bootstrap-responsive.css，那么填充对我来说是相当不错的。但我希望我的网站在手机上运行良好。所以有必要包含这个文件，直接影响（为什么？）是padding-left（或margin-left，我不知道）不太重要。

我尝试在我自己的 CSS 中为容器类手动添加 padding-left 或 margin-left，但它扩大了页面的宽度并创建了一个水平滚动条。

你知道一种安全的方法吗，也许是使用 Bootstrap 提供的工具？

【问题讨论】：

标签： twitter-bootstrap

【解决方案1】：

<div class="container">
  <div class="row-fluid">
    <div class="col-md-offset-2 col-md-8">
      Content
    </div>
  </div>
</div>

【讨论】：

【解决方案2】：

也许还有其他方法，但试试吧。像这样：

<div class="container">
    <div class="row-fluid">
        <div class="span2"></div>
        <div class="span8">
            Content
        </div>
        <div class="span2"></div>
    </div>
</div>

这使您的页面同时响应和缩小。关于bootstrap fluidgridsystem。

【讨论】：

几乎完美。唯一的问题是，当我缩小页面时，空的 span2 会越过 span8 并创建一个可见空间。有解决办法吗？
有点老套，但<div class="span2" style="line-height:0px;"/> 会起作用。
style="min-height:1px;" 更 hacky :)
第一次登录 Stack，但我发现上面的方法，即使在“span10”的任一侧使用“span1”，填充太多。相反，我为我的网站创建了一个新的 CSS 细节，并在“行流体”之后添加了一个名为“padding2”的类，并给它“填充：2%”。有什么理由这是一个坏主意吗？我是新手。谢谢！
@brendaard Bootstrap 样式处理完全不同，当您开始定义自己的 css 类并通过引导程序混合它们时，使用或决定为其他组件选择适当的类将会很复杂。因此，在开始自定义引导 css 之前，您应该查看 here 并为您的项目确定适当的值，然后下载并使用您的自定义文件。