Question

需要按如下方式呈现N个对象的列表：

[Thumbnail 1] [Thumbnail 2] [Thumbnail 3] [Thumbnail 4]

[Thumbnail 5] [Thumbnail 6]

对象数N是动态的。假设在上述情况下N为6用于说明目的，最后两个额外项目（缩略图5,6）之间的差距与第一行中的差距一致。

但是，我的代码总是显示最后一行

[Thumbnail 1] [Thumbnail 2] [Thumbnail 3] [Thumbnail 4]

[Thumbnail 5]               [Thumbnail 6]

请指出如何纠正最后一行中的这种不一致差距？

在我的Django模板中，这是代码

<div class='row row-flex movie-thumbnails clearfix'>

{% for movie in object_list %}
  <div class='col-md-3'>
  {% include "movie/movie_thumbnail.html" with movie=movie %}
  </div>
  {% cycle '' '' '' '</div><div class="row row-flex movie-thumbnails clearfix">' %}
{% endfor %}

</div>

.row-flex类是为了确保所有缩略图具有相同的高度。

Answer 1

令人惊讶的是，答案非常简单。将flex-grow设为0

C:\Program Files\Java\jdk1.8.0_65\bin> wsimport -d E:\sei http://www.webservicex.net/geoipservice.asmx?wsdl

Bootstrap Thumbnail Grid中额外项目之间的差距

1 个答案: