如何在div中垂直对齐WITH overflow:hidden

时间:2012-02-26 23:12:19

标签: html css overflow hidden

我知道在div中有很多关于verticaly对齐文本的教程,但是我需要用" overflow:hidden"来做这个,但它只适用于" display:block& #34;,而不是"显示:table-cell"。 这是html:http://melondev.com.br/twitter/ (看看长篇文章,即使是"溢出:隐藏"他们继续......) 谢谢!

1 个答案:

答案 0 :(得分:2)

您可以将overflow: hidden应用于cotaining元素。

严格地说,如果display:table-cell的元素不在display:table-row的元素内,而display:table本身不在<table>的元素中,则会导致不可预测的结果和意外行为,这是其中之一。相反,您可以轻松地使用<table style="table-layout: fixed;"> <tr> <td style="width: 100px; overflow: hidden; vertical-align: middle;">Text here</td> </tr> </table> 这样的元素:

<div>

以上作品!您还可以为您的笔记标题和内容添加行。当然,它并不漂亮,但它使用的是为这种情况设计的东西。

但是,除此之外,你有<span>个元素内{{1}} - 这并不好,很多旧的浏览器(以及最近的一些)会拒绝它。你不应该在内联级别的内部使用块级元素。