如何在引导程序中清除响应式 div 之间的边距答案

【问题标题】：How to clear margins between responsive divs in bootstrap如何在引导程序中清除响应式 div 之间的边距
【发布时间】：2015-12-04 18:26:23
【问题描述】：

我在引导项目中有这段代码，我不能将响应式 div 并排放置，它们之间没有边距。谁能帮帮我？

这是我的代码：

.container-vip {
  width: 100%;
  height: 300px;
  background: #09C;
  border: 1px solid #fff;
  padding: 0;
  margin: 0;
  float: left;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />

<div class="row">
  <div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
    <div class="container-vip">
    </div>
  </div>
  <div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
    <div class="container-vip">
    </div>
  </div>
  <div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
    <div class="container-vip">
    </div>
  </div>
  <div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
    <div class="container-vip">
    </div>
  </div>

</div>

【问题讨论】：

您不希望在哪里获得保证金？你能解释一下吗？
创建新的 css 规则以覆盖设置边距的引导样式。

标签： html twitter-bootstrap css margins

【解决方案1】：

它们不是边距，它是填充，您可以在 col-* div 上使用 padding: 0px 将其删除。

【讨论】：

【解决方案2】：

你只需要在你的 div 中添加一个类

<div class="col-xs-6 col-sm-6 col-md-3 col-lg-3 no-padding">
    <div class="container-vip">
    </div>
  </div>

并在您自己的 .css 文件中为其添加 css

.no-padding{padding: 0 !important;}

当然你可以用自己的名字代替“无填充”

【讨论】：

就是这样。我很感激

【解决方案3】：

将此规则添加到自定义 css 文件的底部

.col-xs-6, .col-sm-6, .col-md-3, .col-lg-3{
background:red;
padding:0px;
}

【讨论】：