在手机上查看我的 twitter bootstrap 网站时,每边都有 20px 的排水沟。这会阻止任何触及桌面边缘的内容在移动设备上这样做。在移动设备上查看时,twitter 引导主页本身没有这些排水沟。http://twitter.github.com/bootstrap/
其他网站说放置一个 body {padding-left:0;padding-right:0} 会有所帮助,但这会造成另一个问题,即弄乱导航栏。
有什么线索吗?
在手机上查看我的 twitter bootstrap 网站时,每边都有 20px 的排水沟。这会阻止任何触及桌面边缘的内容在移动设备上这样做。在移动设备上查看时,twitter 引导主页本身没有这些排水沟。http://twitter.github.com/bootstrap/
其他网站说放置一个 body {padding-left:0;padding-right:0} 会有所帮助,但这会造成另一个问题,即弄乱导航栏。
有什么线索吗?
尝试在 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;
}
}
上面的答案并没有为我解决同样的问题......但确实让我找到了自己的解决方案
@media (max-width: 767px) {
body {
position: absolute;
}
}
没有位置:绝对;在正文标签上,我最终在 iPhone 等小屏幕上的文档右侧出现了一个巨大的排水沟。但是当我添加 position:absolute; 到 body 标签,我在大型桌面屏幕上得到相同的排水沟。把它放在上面的媒体查询中为我解决了这个问题。
我欢迎解释为什么会发生这种情况。
我正在使用 bootstrap 3.0 final