当我减小浏览器窗口的宽度时，尽管有以下命令，但其中的select元素fieldset大小不会减小：max-width
<fieldset style="background:blue;">
<select name=countries style="max-width:90%;">
<option value=gs>South Georgia and the South Sandwich Islands</option>
</select>
</fieldset>
然而，这完全适用于外部fieldset元素。如何使select元素缩小到字段集中的max-width（百分比）？
注意：我已经测试了 Firefox 12.0 和 Google Chrome。我现在确定这是一个跨浏览器的问题。
澄清：请参考此示例并注意 aselect内部元素的行为fieldset与fieldset. 我想要实现的是让select元素内的元素fieldset表现得像元素外的fieldset元素。
这是不可能的，至少如果您只使用max-width（请参阅下面的解决方案）。<select>s 的样式总是有点棘手，因为它们是交互式内容元素 和表单控制元素。因此，他们必须遵循一些隐含的规则。一方面，在使用max-width. 考虑以下场景：
+------------------------------------------------+-+ |另一个条目 |v| +------------------------------------------------+-+ |另一个条目 | |请选择框，请选择任何内容 | |另一个条目 | |另一个条目 | +------------------------------------------------+-+
假设你想挤压这个<select>- 会发生什么？选择的宽度会变小，直到...
+------------------------------------------------+-+ +---------- --------------------------+-+
|另一个条目 |v| |另一个条目 |v|
+------------------------------------------------+-+ +---------- --------------------------+-+
|另一个条目 | |另一个条目 |
|请选择框，请选择任何内容|-->|请选择框，请选择任何内容|
|另一个条目 | |另一个条目 |
|另一个条目 | |另一个条目 |
+------------------------------------------------+-+ +---------- --------------------------+-+
|
+----------------------------------------------------+
v
+---------------------------------+-+ +---------- ----------------------+-+
|另一个条目 |v| |另一个条目 |v|
+---------------------------------+-+ +---------- ----------------------+-+
|另一个条目 | |另一个条目 |
|请选择框，请选择任何内容|-->|请选择框，请选择任何内容|
|另一个条目 | |另一个条目 |
|另一个条目 | |另一个条目 |
+---------------------------------+-+ +---------- ----------------------+-+
然后该过程将停止，因为<option>s 不再适合。请记住，如果没有一些讨厌的怪癖，您将无法设置样式<option>s或至少只有一点点（颜色，字体变体）。但是，如果选择准备正确，可以更改边框框：
在 上使用一个width值select。是的，就这么简单：
<fieldset style="background:blue;">
<select name=countries style="width:100%;max-width:90%;">
<option value=gs>South Georgia and the South Sandwich Islands</option>
</select>
</fieldset>
为什么这行得通？因为option现在width将正确识别 的select并且不会强制select具有隐含的min-width. 请注意，width是荒谬的，因为它比max-width. 在这种情况下，大多数浏览器不会关心和使用max-width，因为它提供了一个上限。
JSFiddle Demo（适用于 FF12、Chrome 18、IE9、Opera 11.60）
基于包装的解决方案，这不会改变原始宽度：
<fieldset style="background:blue;">
<div style="display:inline-block;max-width:90%;"> <!-- additional wrapper -->
<select name=countries style="width:100%">
<option value=gs>South Georgia and the South Sandwich Islands</option>
</select>
</div>
</fieldset>
JSFiddle Demo（在上面列出的浏览器中工作）
这是你要找的吗？
<fieldset style="background:blue; display:inline; width:100%;">
<select name=countries style="width:90%;">
<option value=gs>South Georgia and the South Sandwich Islands</option>
</select>
<input name=others style="display:block; min-width:300px; width:90%;">
</fieldset>
无论哪种方式，当您使用一个值（例如 300 像素）指定宽度时 - 此高度将优先，并且元素本身将被分配 300 像素。定义width百分比并给出min-width绝对值。百分比取自其父元素。所以，你也应该给它的父母一个百分比。
我希望这有帮助。
包装选择。在本例中，我将使用带有“select_wrap”的 div。
div.select_wrap {
height: 1em;
}
div.select_wrap select {
position: absolute;
max-width: calc(100% - 6px);
text-overflow: ellipsis;
}
“绝对”上下文允许解释最大宽度 - 没有实际的位置信息，只是将其强制到不同的上下文中。calc() 让您更详细地了解 max-width 实际应该是什么，因为您没有以前的边距和填充。文本溢出看起来不错。
需要 select_wrap 的高度来确保表单按预期围绕 select 流动 - 您需要保留 select 以前填充的空间。
尝试：
fieldset select{
margin:auto
}