CSS：如何使每列两个图像滚动水平图像？

Question

我有一个水平图像滚动条，如下所示：

这是标记：

<div class="slider-horizontal">
  <span ng-repeat="image in images">
    <a href="#">
      <img ng-src="{{image}}" />
    </a>
  </span>
</div>

这就是风格：

.slider-horizontal {
  white-space: nowrap;
  overflow: auto;
  overflow-y: hidden;
}

不，我想在下面添加任何当前的二级图像，以获得类似的内容：

（N.B。：当然也不是人，也不是折扣标签是真实的图像......： - ）

有可能吗？你会建议什么？我无法管理它，我的所有试验都以同一行中的所有图像结束，或者同一列中的所有图像......： - （

回复@rednaw评论：这就是我尝试过的：

<div class="slider-horizontal">
  <span ng-repeat="image in images">
    <a href="#">
      <img ng-src="{{image}}" />
      <img src="images/watermarks/label.png" />
    </a>
  </span>
</div>

（虽然不是很成功，正如我所说......： - （）

Answer 1

编辑：

你试过这样的事吗

<div class="slider-horizontal">
  <span class="slider-image" ng-repeat="image in images">
    <a href="#">
      <img ng-src="{{image}}" /><br>
      <img src="myimg.jpg" />
    </a>
  </span>
</div>

CSS：

.slider-horizontal {
  white-space: nowrap;
  overflow: auto;
  overflow-y: hidden;
}

.slider-image {
  float: left;
  margin-right: 20px;
  display: inline-block;
}