Bootstrap：移动显示上的列之间的间隙

我正在使用 bootstrap 3.0 制作一个网站，我希望 HTML 和 CSS 能够在桌面、平板电脑和移动设备上清晰地看到。

我遇到的一个问题是，当您在移动显示器上查看该网站时，该列会堆叠在一起（我并不是在批评它，因为它会尽可能地停止滚动）。但是，我希望列之间有一点间隙（甚至 1-2px）。

到目前为止的代码

<div class="row">
    <div class="col-xs-12 col-sm-8 col-md-8">
        <div class="Columns">
        ..content 
        </div>
    </div>
    <div class="col-xs-12 col-sm-8 col-md-4">
        <div class="Columns">
        ..content
        </div>
    </div>
</div>

显示其正在执行的操作并显示堆栈列的图像

我怎样才能在柱子之间实现一点间隙？

Thanks

添加自定义类.column-margin设置行/列之间的边距。

@media (max-width: 991px) {
  .column-margin {
    margin: 2px 0;
  }
}

<div class="row">
  <div class="col-xs-12 col-sm-8 col-md-8">
    <div class="Columns column-margin">
      <img src="http://placehold.it/300x300" />
    </div>
  </div>
  <div class="col-xs-12 col-sm-8 col-md-4">
    <div class="Columns">
      <img src="http://placehold.it/300x300" />
    </div>
  </div>
</div>

Codeply