底部对齐自举缩略图，同时保持它们水平居中

Question

我已经阅读了很多类似的问题，并尝试通过添加位置的div来应用答案：绝对和相对aroudn图像到代码但我无法使其工作。

http://store9711.americommerce.com/milk-glass-vases-and-candle-holders.aspx

我需要底部对齐这些缩略图，同时保持它们水平居中

有人能告诉我怎么做？

Answer 1

您需要使用vertical-align属性

CSS

.category-product .thumbnail img {
  display: inline;
  vertical-align: bottom; /*Add this line*/
 }
.category-product .thumbnail{ 
   display:block; 
}

同时将display:block提供给锚标记以使图像保持水平居中。

Answer 2

.category-product .thumbnail img {
display: inline;
vertical-align: bottom; /*add this*/
}

您网站上的默认Bootstrap设置（bootstrap.min.css的第7行）与中间对齐（应用于img HTML元素）。您只需要覆盖类别图像。