HTML入力オーバーフローが追加パディング（Firefoxの）

Question

編集：私はHTML入力エレメントとも数値入力エレメントを使用していますAdded Picture showing the left "padding"

。 両方の要素。

文字の数が入力要素のサイズよりも長く、カーソルを最後に入力した文字に移動すると、入力要素の先頭にいくつかの魔法の「パディング」が追加されます。

この現象を防止する方法はありますか？

例：私は背景としてさらにグリッドを使用していますが、要素のパディングが変化している場合は、グリッドが収まらない

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

<input type="text" value="000"><br> 
 
<input type="text" value="000000000"><br> 
 
<input type="number" value="000"><br> 
 
<input type="number" value="000000000"><br>

注

。

Answer 1

私は右のあなたを理解し、あなたのHTMLブロックにパディング影響を除去する必要がある場合は、

*{ 
    box-sizing: border-box; 
} 

または必要に応じてブロックにこのルールを適用するを使用する必要があります。