Twitter Bootstrap 3.0比窗口宽

Question

我正在摆弄Twitter Bootstrap并注意到我.row比屏幕长度更宽.

这是一个例子

当bootstrap 3.0问世时,我没有遇到过这种情况.

右侧的额外空间来自 margin-right: -15px;

我一直瞪着这几个小时没有取得任何进展,为什么或如何欺骗自己,搜索没有帮助.

我敢肯定我错过了显而易见的事实.我想了解为什么窗口宽度以外的空间(强制滚动)以及如何避免它.我以为一排会匹配100%

Answer 1

正确的解决方案(https://getbootstrap.com/docs/3.3/css/#grid-example-fluid)是使用container-fluid周围div 的类:

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

Answer 2

我通过在bootstrap中从.row中删除margin-left和margin-right以及将其宽度设置为100%来修复它

Answer 3

编辑>>

这是之前接受的答案.如果任何人使用旧版本的网站,则取消删除.

编辑<<

这是一个错误

这似乎一直没有固定.也许3.1中的正确修复.

最好的建议似乎是"overflow-x: hidden对body元素.

除此之外,他们在此提交中添加/澄清了部分内容

特别是这一行"想要创建完全流畅布局的人(意味着你的网站延伸了视口的整个宽度)必须将他们的网格内容包装在一个包含元素中,padding: 0 15px;以抵消margin: 0 -15px;使用的.row"