<分区>
在 CSS 中设置某些元素(即表单中的“选择”元素)的宽度(在本例中为 200 像素)时，我注意到一些有趣的事情。似乎选择元素总是有点太窄，所以我的表单中的输入不统一。这是一个示例(屏幕截图来自 chrome，但在 IE 中也会发生这种情况)。
css 是这样的:
input { width: 200px; }
select {width: 200px; }
和关联的Fiddle
我并没有那么困扰，但我能做些什么来可靠地解决这个问题吗？
<分区>
在 CSS 中设置某些元素(即表单中的“选择”元素)的宽度(在本例中为 200 像素)时，我注意到一些有趣的事情。似乎选择元素总是有点太窄，所以我的表单中的输入不统一。这是一个示例(屏幕截图来自 chrome，但在 IE 中也会发生这种情况)。
css 是这样的:
input { width: 200px; }
select {width: 200px; }
和关联的Fiddle
我并没有那么困扰，但我能做些什么来可靠地解决这个问题吗？
最佳答案
由于框尺寸不同，选择尺寸与输入尺寸不同。输入的框大小设置为“内容框”，而选择的框大小设置为“边框框”。
解决方案是像这样指定框模型:
input, select{
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
关于html - 在 CSS 中设置 select 和 input 元素的宽度相等，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19940735/