向所有列元素添加margin-bottom

Question

在一个bootstrap 3项目中，我想要一些围绕cols的边框，所以我做了以下css Fiddle。

.admin-div{

    background-color: #fff;
    border-radius: 7px;
    border: 1px solid #ccc;
    padding:20px;
}

当我使用它时，我把它放在一个像：

的col里面

 <div class="col-md-6 col-sm-8">
     <div class="admin-div">
     </div>
 </div>

这在大屏幕上工作正常，但在小屏幕上没有边距（注意：最左边没有自定义admin-div类，并且是默认列表组）。

大屏幕（col＆＃39>之间的好余量）

小屏幕（col＆＃39;之间无边距）

一个选项是添加

margin-bottom:20px 

对所有sm和sx元素，但听起来有点矫枉过正。

我可以用

 @media (max-width: 970px) { .spacing-div{ margin-bottom: 20px; } } 

但是我必须在我有一个col的所有div中添加一个额外的类。

所以我有两个解决方案，但他们都觉得可以用更容易的东西取而代之。 什么是最好的方法 所有col 有一个保证金底部：20px;甚至在小屏幕上？

额外的admin-div只是为了显示问题，如果没有额外的div我仍然会遇到问题，但它不会那么多。