CSS float 元素浮动后左右高度不一致解决办法

场景

给右边元素添加float:right后，左右两边高度不一致，左低右高。

解决办法

1. 给父元素定义font-size:0;
2. 浮动子元素定义需要的font-size， 再定义vertical-align:top;
3. 若有优先级设置，请注意添加!important;

示例

ul {
    font-size:0; 
}

li {
    vertical-align:top; 
    font-size:12px; 
}