给html中设置font-size为什么会影响到div的大小？

Question

给html中设置font-size：50px；
.search_box被子元素多撑出一些是怎么回事？
demo在这个https://jsfiddle.net/bsr1asaz/

Answer 1

把不相关的代码注释掉。

再在两个a中间加一个|就可以看到这是line-height的问题。因为.search_box继承了html的font-size属性。所以产生了行高，具体说一下。

display: inline-block;的本质是对内表现为块，对外表现为行内元素。也就是说他表现为即可以设置宽高，又以行内元素显示，这也就产生了行框。行高产生了撑出了高度。

http://codepen.io/liuzhenbase/pen/eJpZoP

Answer 2

是line-height的问题

Answer 3

如果不规定.search_box的宽高，它的大小将由里面的内容来决定