向响应引导行添加左、右科尔的最佳方法？(用树枝)

Question

我使用TWIG来呈现一些HTML/Twitter引导CSS代码。我使用以下代码创建了一个图片库：

<section class="row align-items-center" style="margin:0px; padding:0px;">    
      {% for i in contents %}
      <div class="col-xs-12 col-sm-4 col-md-3 col-lg-2 text-center box">
        <a href="#">
          <img class="ownthumbnail" src="{{ asset('images/'~section~'/'~i) | imagine_filter('mini') }}" alt=":-)">
        </a>
      </div>
      {% endfor %}
</section>

出于一些设计原因，我想自动添加两列(一列左，右一行边距)，与窗口大小无关(xs、sm、md或lg)。，你会怎么处理这个问题?

编辑:为了清楚，我现在得到的是一个画廊有6列( column 2)，4列(col-md-3)，3列(Column 4)或1列(col-xs-12)取决于屏幕的大小。我想要相同的网格布局，但让左列和右列为空。这将是理想的情况下，如-lg-2的情况下，有9张图片：

emp:空img:图像

[empt][img1][img2][img3][img4][empt]
[empt][img5][img6][img7][img8][empt]
[empt][img9][empt][empt][empt][empt]

Answer 1

我回答我自己的问题:我使用JavaScript动态地设置库。在HTML中，我有一个隐藏的“行”，我的图片所在。当窗口加载或调整大小时，我使用ResponsiveBootstrapToolkit库获取当前引导带的断点，并使用额外的空cols克隆隐藏行以获得我想要的布局。

Answer 2

对于您的div标记的类，可以设置class=“col-xs-6-col-sm-6 col-md-6col-lg-6”。我希望这是可行的。它应该在每一行中设置两列。