无序列表中的奇怪空间

Question

我正在尝试设计一个缩略图，其中包含我网站上上传的最新图片。在项目中使用引导推特。 缩略图工作正常，除了一些细节。缩略图包含 3 行 4 列，在第二行中，在第一、第二和第三个列表位置存在一个空格。这是一个屏幕：

html代码是用Smarty生成的，就是代码，运行良好：

<ul class="thumbnails lastFotos">
{foreach from=$last_fotos item="foto"}
     <li class="span1"><a class="thumbnail"><img src="{$BASE_URL}/assets/img/galeria/{$foto.Nombre}"  alt="{$foto.Nombre}"/></a></li>
{/foreach}
</ul>

Thumbnails、thumbnail 和 span1 是 Bootswrap 的类，而 lastFotos 是为我创建的类，用于更改 Bootstrap 的一些配置：

ul.lastFotos{ margin-left: 22px; }

ul.lastFotos li{ display: inline; margin-bottom: 7px; margin-left: 5px; }

ul.lastFotos li a{ border-radius: 0; padding: 2px; }

ul.lastFotos li a:hover{ border-color: #8e84b8; }

有什么想法吗？

Answer 1

这是因为图片大小不同，给height 给list 或image 它会修复它

喜欢

ul.lastFotos li {height:60px;}

或

ul.lastFotos li img{width:60px;height:60px;}