inline-block to span标记在IE和webkit浏览器中的行为有所不同

Question

display:inline-block到span标记在各种浏览器中的行为方式不同。在IE浏览器中，它完美运行。但在webkit-browers（Chrome，Safari等）中，span与其子标记之间存在一点差距。
以下是示例代码：

     <style>
       span{
         display:inline-block;
         border:1px solid red;
         padding:0px;
         margin:0px;
        }
     </style>

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

不同浏览器的输出
IE

Chrome和Safari

看到spand和输入字段之间存在差距......

Answer 1

你应该使用这个选择器，因为余量在span和input之间，而不仅仅是span，所以你需要定位input元素而不是span元素

span input {
    margin:0px;
}

Demo