多行文字居中

多行文字的垂直居中

解决方案：vertical-align 方法

.box{ border:1px solid #f00; background-color:#eee; width:500px; height:100px;vertical-align:middle;display:table-cell;} 

效果图：

说明：可以看到，这种方法能够使得单行文字、多行文字都居中。但是因为 table-cell 是 inline 类型，所以会导致原来的块级元素每个 div 一行移动到了同一行。如果需要分列两行，需要在外面额外添加容器对位置进行控制。