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

Question

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

有 20 像素的边距，但如果我删除它们，.brand 标志会部分地从右侧的屏幕上移开。

您可以在此处查看问题。

很抱歉这里没有提供代码。我什至不确定要提供哪个 CSS，因为我无法确定问题所在。

Answer 1

在标题为“下载原始滑动文件以确保成功”的块中。你有文字，旁边有一张图片，还有标题“一键下载滑动文件”

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

当浏览器窗口在 780 像素左右时，我所描述的行为最为明显......我们总是有可能看到不同的东西；）

祝你好运！

Answer 2

.navbar .brand 有

margin-left:-20px;

所以这种行为对我来说似乎很正常。通过您的媒体查询将其设置回 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;
}