Html Chrome输入类型编号

当“输入类型”为“数字”时，Chrome会渲染不同外观的输入框，框中的数字会被底部修剪。有没有办法在不改变输入控件大小的情况下修复它

任何帮助都将不胜感激

文本和数字输入在Internet Explorer中呈现相同的外观

<div class="container">
    <div class="small">
    <input type="number" placeholder="Number"  value="8" class="form-control  input-xs">
        <br/>
    <input type="text" placeholder="Text" value="8" class="form-control  input-xs">
   </div>
</div>



input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance:textfield;
}
.input-xs {
    height: 22px;
    padding: 5px 5px;
    font-size: 10px;
    line-height: 1.5;
    border-radius: 3px;
}

输入[类型=编号]：-webkit外部旋转按钮，
输入[类型=编号]：-webkit内部旋转按钮{
-webkit外观：无；
保证金：0；
}
输入[类型=数字]{
-moz外观：textfield；
}
.input xs{
高度：22px；
填充物：5px 5px；
字体大小：10px；
线高：1.5；
边界半径：3px；
}

输入xs的

行高度

类正在干扰它。 如果你把它拿走，看起来没问题。这是因为并非所有浏览器都支持

行高度
内部
输入

Chrome和Safari尊重输入的线高度值，
Firefox、Internet Explorer和Opera则不然


我认为你不能把这称为bug。有一个固定的高度和一个更大的线高度，所以有一个溢出。当然，这不会发生在其他浏览器中，但这是因为其他浏览器不支持输入中的行高度。所以，这不是一个bug，而是一个特性！谢谢你的信息！还是这样吗？虽然Chrome和Safari尊重输入的行高值，但Firefox、InternetExplorer和Opera不尊重。说Chrome“根据规格”做得不对。然而，MDN指出的实际规范并没有具体说明输入内部应该发生什么。
.input-xs {
    height: 22px;
    padding: 5px 5px;
    font-size: 10px;
    /*line-height: 1.5; or set to 'line-height: 1'*/
    border-radius: 3px;
}