省流：内层标签想外超，外层盒子下鼓包。浮动至此断了路，定睛一看有限高。
晚上看虎牙直播的时候，突然发现页面标签错位
切换其他直播间发现还是动态变化的
震惊虎牙这么大平台会出现这样的问题，顺手F12看看怎么回事
审查元素发现所有的a标签都设置了float属性，那应该是【护道人标签】本来应该浮动到第二行开始的位置却被挡住了
下图可以看到当前直播间的标签高度比其他直播间多了一些像素
直接设置a标签高度为42px，加上border 2px，恢复正常了
那多出来的 .12px 从哪里来的？接着找内部的元素
内部三个标签，删除i标签就恢复正常，应该就是这里的问题了
当前直播间区别于其他有一个'on'的类，.on i 设置为行内块，是它把整个盒子撑高了。 i标签的高度12px，margin-top 15px，也没有超过盒子高度，但是默认的vertical-align:baseline 设置i标签与文字基线对齐，但是文字基线距离顶部的距离刚好小于 12 + 15 ，（行高42px，字号16px具体怎么算的暂不得知）于是为了容纳i标签，文字基线下移，整个盒子撑高了，这样就挡住了第二行浮动至开始位置的路。
解决思路：让i标签不影响外部盒子高度
一些办法：
- 放弃float，直接设置a标签宽高，行内块自然排列就行；
- 针对出现问题的i标签：调整i标签高度，但是会使图片显示不全，直接减小margin-top就可以
- 更改i标签的vertical-align属性，此处sub，top都可以
还是更推荐去除margin-top，看起来在这里没有作用，还引发了问题
大功告成！关闭控制台，发布文章，等待虎牙offer。。。
