Question

我创建了一个带引导程序的移动页面，但是对于某种类型，移动页面在我可以滑动到的右侧的移动设备上有边距或填充。我删除了一些代码，但即使是最简单的结构也是如此：

    <div class="container">
        <div class="row">
          <div class="col-lg-12">
            <div class="navigation"></div>
          </div>
        </div>
    </div><!--container-->

.container {
  max-width:100%;
  padding:0;
  height: 100%;
  width:100%;
}

.navigation {
  height:3.4375em;
  line-height:1em;
  background-color:#E75200;
}

我在这里上传了测试页面： http://wp1011618.server-he.de/projekte/test/index2.html

我觉得这是因为col-lg-12填充，但Bootstrap这不是Bootstraps的意图，所以我想知道这里有什么不对吗？

谢谢！

Answer 1

我明白了：

html, body {
  overflow-x: hidden;
}

为我解决了！

Answer 2

.col-lg-12 类有padding-right: 15px;和padding-left: 15px;，会导致出现空格。将它们设为0，而不是删除 .row 类中的margin-right: -15px;和margin-left: -15px;。

Answer 3

如果要在示例标题上设置右边距，则只需在.container中执行该样式，例如：Padding-Right：12px。

Answer 4

你知道你的js目录中没有bootstrap.min.js文件吗？无论如何，解决方案就是不要使用＆＃34; col-lg-12＆＃34; div，＆＃34; row＆＃34;将填充100％的宽度，为什么你想要这个？

Bootstrap - 移动设备上的某种边距（仅右侧）

4 个答案: