組合框（選擇）css寬度問題（任何瀏覽器）

在CSS中輸入的width屬性與組合框中呈現的值之間存在不一致。組合框（選擇）css寬度問題（任何瀏覽器）

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>

的從寬度「中選擇」元素被從其減去填充和邊框之前呈現。這是正常的嗎？如果是這樣，那麼一些文件解釋？

來源

2012-10-12 Luiz Gustavo F. Gama

是的，這很正常。這就是CSS框模型的工作原理。

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

來源

2012-10-12 12:38:56 cimmanon

是的。我找到了一個解釋：文本輸入和選擇輸入的默認方框大小屬性不同。爲了解決這個問題，我剛剛添加了這個屬性： -webkit-box-sizing：content-box; -moz-box-sizing：content-box; box-sizing：content-box; 非常感謝。解決方案：http://jsfiddle.net/ZceeE/1/ –

組合框（選擇）css寬度問題（任何瀏覽器）

回答

相關問題