多行文本居中采用display:table后会产生的问题

当实现多行文本居中时,很自然想到以下设置给父级设置display:table;给子集设置display:table-cell;和verticle:middle;
如果其中是中文的话一切正常,中英混合也还ok,可是若是纯英文的话会发现他压根不会换行,除此之外还会抵消掉你原本的外层盒子的宽度,对比如下

sddljfslkddflkdsfsdfsadsadfsdfsdfqwersdfasdfsdf


<style type="text/css"> .haha{ width:200px; height:200px; word-wrap: break-word; background:#bfa; display:table; color:white; }

p{
display:table-cell;
vertical-align:middle;

}
</style>

上一篇:八大基本排序算法-----归并排序


下一篇:[CF1231E] Middle-Out - 贪心