Twitter bootstrap 带边距的引导选项卡

我有一个web应用程序，它使用引导选项卡。请参见下面的图片

我想确保选项卡和文本之间有一些空白/边距

 <div class="row">
    <div class="col-lg-12">
       <h2 class="page-header">More information</h2>
    </div>
    <div class="col-lg-12">
      <ul id="myTab" class="nav nav-tabs nav-justified">
        <li class="active "><a href="#tab-one" data-toggle="tab"><i class="fa fa-tree"></i>Images</a></li>
        <li class=""><a href="#tab-two" data-toggle="tab"><i class="fa fa-car"></i>Full Description</a></li>
        <li class=""><a href="#tab-three" data-toggle="tab"><i class="fa fa-car"></i>Details</a></li>
      </ul>

    <div id="myTabContent" class="tab-content margin-bottom">
      <div class="tab-pane fade active in" id="tab-one">
          <p>Here comes the pictures</p>
      </div>

      <div class="tab-pane fade" id="tab-two">
          <p>Here comes the large description</p>
      </div>
     .......
     .......

---

然后将该样式应用于第一个代码段的不同类，但无法使其工作。欢迎任何建议

您正在尝试更新内容的底边距。 您应该调整实际选项卡的上边距或下边距。因此，要么：

#myTabContent {
  margin-top: 1.25rem;
}

或：

（当然，根据需要修改选择器）

---

这是因为marginbottom是当前元素的底部和它下面的底部之间的空间。边距顶部会将当前元素向下推一点，边距底部会将其下方的元素向下推一点。

尝试添加类清除修复

---

很简单，但我自己还是没有找到：-）谢谢。测试和工程完美！我使用了第二种选择。每个人都会遇到：）

#myTabContent {
  margin-top: 1.25rem;
}

#myTab {
  margin-bottom: 1.25rem;
}