Bootstrap网格问题

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

将padding添加到持有col-md-4的框中会覆盖Bootstraps＆＃39;默认装订线填充，因此删除列之间的间距。

这两个选项是将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进行游戏并调整其厚度。

Example fiddle