CSS：包含图像和文本的列表。做出回应

Question

所以我有以下情况：

输入此jsbin： http://jsbin.com/diqax/1/edit

如果您注意到这是一个列表，每个列表项都有一个带文本的图像，我面临的问题是我希望底部的列表项根据最大项的高度向下推文本。

Answer 1

好吧，您应该将列表项的显示类型更改为inline-block，而不是使用float，然后使用vertical-align: top;垂直对齐内联块元素。

#gallery li {
  display: inline-block;
  vertical-align: top;
  /* other styles here... */
}

<强> Online Demo

有关详细信息，请参阅my answer here，同样为了删除内联（-block）元素之间的空白区域，您可以refer to this。