html - textareaクローム幅高さ

Question

次のHTMLを使用します。

<textarea></textarea>

そして次のCSS：

textarea{
display: block;
margin: 0px;
padding: 0px;
border: 0px;
outline: 0px;
width: 100px;
height: 100px;
resize: none;
}

Firefox、Safariは、100 x 100のテキストエリアを期待していたものを提供しますが、Chrome 111 x 111（Chromeインスペクターでさえ100x100を表示します）。

これが私が撮ったスクリーンショットです：http：//afbeelding.im/GF5f3d

score 3 · Accepted Answer

パディングとマージンのものについて混乱していますか？box-sizingここにある！

box-sizing要素のサイズが、設定したものとまったく同じサイズであることを確認できます。パディングやマージンに関係なく、同じサイズのままです。

box-sizing: border-box;  //This will make your life much easier.

1 に答える 1