添加了一个无意义的新标签
当设定内容宽度的时候,文本换行了
对于第一点,解决的办法是使用 :before 伪元素 :
1 2 3 4 5水平垂直居中 6 23 24 25 26 27 多行文字居中 多行文字居中 多行文字居中 28 29 30
附Demo
但是!大家也都注意到了:文本换行了
这便是inline-block产生的空隙在捣乱了
为了解决这个问题,可以试试这个hack:
1 .wrapper {2 font-size:03 }4 5 .content {6 font-size:16px7 }
保存再看看:
搞定!
附完整源码
参考资料(推荐阅读):
CSS制作水平垂直居中对齐
如何解决inline-block元素的空白间距
inline-block 前世今生