html - 使用相对定位和内联 block 的 DIV 的垂直对齐？

Question

我在垂直对齐 DIV 时遇到问题，因为其中的内容具有不同的高度(尽管 DIV 本身具有固定大小)。

See HTML example here (with inline CSS)

我希望 DIV 像文本一样“流动”，所以我想尽可能避免使用 position:absolute。我正在使用 display: inline-block 使 DIV 不会折叠。

Answer 1

添加一个 vertical-align 属性——不管是哪一个，它们都做同样的事情，因为它们的大小相同。如果它们的大小不同，请使用 vertical-align: middle:

.collection_box {
    vertical-align: middle; /* or top, or bottom, if they're the same size */
}