使用Bootstrap在移动设备上清空左边距

Question

我正在使用Bootstrap框架在网站上工作，并注意到在移动设备上，窗口右侧有一个空白边。我相信这是标签的某种问题，尽管我无法确定它。

有20px的边距，但是如果我将其删除，.brand徽标会从右侧的屏幕上部分移开。

您可以查看问题here。

很抱歉不在这里提供代码。我只是不确定提供哪个CSS，因为我无法识别问题。

Answer 1

在标题为“下载原始刷卡文件以确保您成功”的块中。你有文字，侧面的图像和标题'一键下载刷卡文件'

标题实际上是一个svg文件，我认为在某些视口中它对于引导列来说太宽了，它会破坏网格。我无法确定，但您可以尝试暂时删除标题，看看会发生什么。

当浏览器窗口大约为780px时，我所描述的行为最为明显......我们总是可以看到不同的东西;）

祝你好运！

Answer 2

.navbar .brand有

margin-left:-20px;

所以这种行为对我来说似乎很正常。 通过mediaquerie将其重新设置为0

编辑：删除身体上的填充：

@media (max-width: 767px)
body {
padding-right: 20px;
padding-left: 20px;
}

和.navbar-fixed-top，.navbar-fixed-bottom，.navbar-static-top的边距：

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