html - コンボボックス（選択）CSS幅の問題（任意のブラウザ）

Question

CSS に入力された width プロパティとコンボ ボックスに表示される値との間に矛盾があります。

http://jsfiddle.net/ZceeE/

CSS:

.foo {
    width:300px;
    padding:10px;
    border:1px solid #ccc;
}

html:

<input type="text" id="text" class="foo"><br><br>
<select id="combo" class="foo">
    <option>bar</option>
</select>

「select」要素は、レンダリング前に幅からパディングとボーダーを差し引いています。それは正常ですか？もしそうなら、いくつかの文書化された説明がありますか？

Answer 1

はい、それは正常です。これが、CSS ボックス モデルのしくみです。

http://css-tricks.com/the-css-box-model/