}
i{
display: inline-block;
height: 100%;
vertical-align: middle;
}
XML/HTML Code复制内容到剪贴板
<div>
<i></i><span>我是特别长的特别长的特别长的特别长的多行文字</span>
</div>
【5】图标和文本对齐
<方法一>使用长度负值
复制代码img{ vertical-align: -5px;}
根据实践经验，20*20像素的图标后面跟14px的文字，vertical-align设置为-5px可以达到比较好的对齐效果
<方法二>使用文本底部对齐
复制代码img{ vertical-align: text-bottom;}
使用baseline会使图标偏上；使用top/bottom会受到其他行内元素影响造成定位偏差；使用middle需要恰好的字体大小且兼容性不高；使用text-bottom较合适，不受行高及其他内联元素影响
原文：http://www.cnblogs.com/xiaohuochai/p/5271217.html
