开满天机
我认为接受的答案实际上不能完全解决问题。您希望vertical-align: middle在表格单元格上有一个内容。但是,当您在表格单元格中添加一个div并赋予其高度时,该内部DIV的内容将位于顶部。检查此jsfiddle。溢出:隐藏;效果很好,但是如果您缩短内容使其只有一行,则该行将不会垂直居中解决方案不是在表单元内部添加DIV,而是在表单元外部添加DIV。这是代码:/* some wrapper */div.d0 { background: grey; width:200px; height: 200px;}div.table { margin: 0 auto; /* just cosmetics */ width: 150px; height: 150px; background: #eee; display: table;}div.tablecell { display: table-cell; vertical-align: middle; text-align:center; height: 100%; width: 100%; background: #aaa;}div.outer-div { height: 150px; overflow: hidden;}
Lorem ipsum