引导网格问题

Question

因此，我一直在尝试找出如何在col-sm-4的各列之间创建空格，而实际上却找不到找到间距的方法。 如您所见，我在各列之间没有间距。

需要这样的东西：

            <div class="inner_img">
              <img src="img/tablets/phoca_thumb_m_1.png" class="center-block">
            </div>

            <h5>Memorial Code: ...</h5>

            <p>.</p>

          </div>
          <div class="col-sm-4 phocagallery-box-file">
            <img src="img/tablets/phoca_thumb_m_2.png" class="center-block">
            <h5>Memorial Code: ...</h5>

            <p>.</p>
          </div>
          <div class="col-sm-4 phocagallery-box-file">
            <img src="img/tablets/phoca_thumb_m_3.png" class="center-block">
            <h5>Memorial Code: ...</h5>

            <p>.</p>
          </div>

CSS：

.phocagallery-box-file {
  background: #525900;
  display: block;
  padding: 5px;
}

Answer 1

在包含col-md-4的框中添加padding将覆盖Bootstraps的默认装订线填充，从而消除列之间的间距。

这两个选项是向内部元素添加padding ，而不是col-md-4所在的位置。

例：

<div class="col-sm-4 phocagallery-box-file">
    <div class="innner-box">
        <img class="center-block" src="img/tablets/phoca_thumb_m_2.png">

        <h5>Memorial Code: ...</h5>

        <p>.</p>
    </div>
</div>

的CSS

.phocagallery-box-file {
  background: #525900;
  display: block;
}

.inner-box {
  padding: 5px;
}

和/或

游玩border并调整其厚度。

小提琴的例子