如何在浮动父元素（已知大小）内垂直居中任意大小的子元素？
display: table-cell; vertical-align: middle;在元素浮动时似乎不再起作用。
我在这里创建了一个SSCCE：http://mathiasbynens.be/demo/center-vertically-inside-float
Without float，一切正常。但as soon as the parent element is floated，垂直对齐失败。
任何想法如何解决这个问题？
编辑：我应该补充说，子元素应该是图像。在我的示例页面中，我使用段落，因为我假设我可以将p元素所需的img元素应用于display: block;元素。 （失败）。
答案 0 :(得分：3)
如果是单行，则将line-height的{{1}}设置为容器的高度。
答案 1 :(得分：1)
Float禁用表格单元格，因为单元格无法浮动。所以基本上我会推荐标准的东西 - 使用浮动垫片技术或绝对定位。
答案 2 :(得分：1)
好的，感谢porneL’s answer，我找到了解决问题的方法。
在我的SSCCE中，我使用段落作为子元素（并且porneL给出了正确的答案），但我真正需要的是图像。事实证明这需要一些额外的CSS：
div { width: 780px; height: 200px; vertical-align: middle; text-align: center; float: left; }
div img { vertical-align: middle; }
感谢您的帮助，伙计们！