我想有一个垂直集中文本。
但问题是:当我增加font-size
时,不同的浏览器会呈现不同的字体系列(字体堆栈),并且不会保持中间对齐。
http://jsfiddle.net/rpNnh/1/
谢谢!
最佳答案
参见jsfiddle中的解决方案
详细
Html代码
<div>
<p>text+<br>sdffd</p>
</div>
<br/><br/>
<a href="#" class="switchFont">Switch Font</a>
CSS
div{
width: 200px;
height: 200px;
border: 1px solid black;
display: table; //added
}
p{
line-height: 20px; //changed
font-size: 18px;
text-align: center;
display: table-cell; //added
vertical-align: middle; //added
}
p.times{
font-family: "verdana"; //changed
}