当在手机上查看我的twitter bootstrap网站时，在侧面添加了一个20px的gutter.我怎么才能阻止这一切

Question

在手机上查看我的twitter bootstrap网站时，每边都有20px的水槽。这将阻止任何触及桌面边缘的内容在移动设备上这样做。当在移动设备上浏览时，twitter引导主页本身并没有这些排水沟。http://twitter.github.com/bootstrap/

其他网站说放一个body {padding-left:0;padding-right:0}会有帮助，但是这会造成另一个问题，那就是搞乱导航条。

什么线索吗?

Answer 1

尝试在 Bootstrap CSS:

之后的某个地方添加这个CSS:

@media (max-width: 767px) {
  body {
    padding-right: 0;
    padding-left: 0;
  }
  .navbar-fixed-top,
  .navbar-fixed-bottom,
  .navbar-static-top {
    margin-right: 0;
    margin-left: 0;
  }
}

Answer 2

上面的答案并没有为我解决同样的问题…但却让我找到了自己的解决方案

@media (max-width: 767px) {
    body {
        position: absolute;
    }
}

带out position:absolute;在body标签上，我最终在小屏幕(如iPhone)上的文档右侧添加了一个巨大的gutter。但是当我加上位置:绝对的;对于body标签，我在大型桌面屏幕上得到相同的gutter。把它放在上面的媒体查询解决了我的问题。

我希望你能解释一下为什么会这样。

我使用bootstrap 3.0 final