css - 如何在 float 父元素(已知大小)内垂直居中任意大小的子元素？

Question

如何将任意大小的子元素垂直居中在 float 父元素(已知大小)内？

显示:表格单元格； Vertical-align: middle; 当元素 float 时似乎不再起作用。

我在这里创建了一个 SSCCE:http://mathiasbynens.be/demo/center-vertically-inside-float

Without float ，一切都按其应有的方式进行。但是as soon as the parent element is floated ，垂直对齐失败。

有什么想法可以解决这个问题吗？

编辑:我应该补充一点，子元素应该是图像。在我的示例页面中，我使用了段落，因为我假设我可以使用 display: block; 将这些 p 元素所需的任何 CSS 应用到 img 元素> 也是如此。 (失败。)

Answer 1

如果是单行，则将p的line-height设置为容器的高度。