div嵌套input，高度上有疑问！

Question

在div里包裹<input type="text">为什么会压着半像素（页面放大超过100%就好了）？

<style type="text/css">
    div{
        width: 554px;
        height: 36px;
        border: 2px solid #ff5000;
    }
    input{
        height: 36px; /*input高度和div一样啊*/
        line-height: 36px;
        border: none;
        outline: none
        padding: 0px;
        margin: 0px;
    }
</style>

<div>
    <input type="text">
</div>

这是100%的图，div被盖住了。

125%，就好了！
是什么原因呢？

Answer 1

box-sizing是什么？是不是他留下的高度不够

Answer 2

你outline后面少了个分号，所以pading,margin都没有生效

Answer 3

最终解决，将input的backGround变成none就可以解决了