'display：table'的高度为100％

Question

我正在使用table方法来垂直对齐内容。出于某种原因，在我要链接的情况下，它不起作用。这是cssdeck链接：

http://cssdeck.com/labs/ebke0fpw

如您所见，结构的高度完全取决于嵌入的Google字体。我已尝试将.meta设为table，并使.metacon成为table-cell以使事物居中。然而;然后height: 100%不再工作了。

我不确定是什么打破了局面。也许你有这个主意。

Answer 1

新代码可能就像这个http://cssdeck.com/labs/lxymkq7t

对内部元素使用display:table-cell，为持有者使用display:table。并使用vertical-align: middle;使对齐中间。

Answer 2

解决方案：

给.title height你应该没问题。

E.g。只需将此行添加到.title

的样式中

height: 150px;

<强>解释

您告诉.meta height 100%。

基于百分比的维度基于元素父级的维度。

.meta的父级是.title，没有声明高度。