
获得徽章 25
- 今天给某个知名div设置了个知名属性overflow:hidden后,元素高度突然增加一半,莫名其妙,黑人问号??何方妖孽在此作妖,看我bing大法,快快现出原型...
经过查阅资料。发现原来是此知名div设置了display:inline-block,当叠加overflow:hidden BUFF后,物理攻击会产生化学反应,造成baseline的移动,所以高度就变得了。
当inline-block元素的display不为visible的时候,其baseline为margin-box的下边界(如下图左侧元素),而右边的元素没有设置overflow:hidden,他的baseline为文字内容的基线。baseline对齐之后则出现了这样的高度差。
通过设置两个标签的vertical-align为bottom(只要vertical的值不为baseline),就可以回到同一基线上,实现对齐。展开赞过评论1