HTML li 标签之间空白间隔的解决办法

• 问题描述：

做抽屉式菜单时候，在 ie 7 下发现 li 元素之间会留白，如下图：

原以为是样式的问题，后来看到有博文写到“行框的排列会受到中间空白（回车\空格）等的影响，因为空格也属于字符，这些空白也会被应用样式，占据空间，所以会有间隔”。

• 解决办法：

li 标签之间的空白，可以通过设置 li 标签的 font-size 为 0，可以解决：

li{
    padding:0;
    margin:0;
    height: 30px;
    line-height: 30px;
    font-size: 0;          /* 设置 font-size 为 0 即可 */
}

修改后的效果如图：