我有一个需要特定宽度的下拉菜单。问题是下拉列表中的内容比宽度长，因此其中一些内容在 IE 浏览器中被隐藏(例如，Chrome 实际上在单击时使下拉区域变长。
想过用 overflow hidden ，结果下拉箭头就没了。有谁知道如何做到这一点？
代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
</style>
</head>
<body>
<div style="width:100px;overflow:hidden;">
<select name="ed">
<option selected>[select]</option>
<option value="">word g g fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">fffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
<option value="">ffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</option>
</select>
</div>
</body>
</html>
最佳答案
将溢出移到选择框本身。
并且用户溢出-y隐藏:
<select name="ed" style="width:100px;overflow-y:hidden;">
我的错误...要让它在 IE7/8 中正常工作，您需要一点 javascript。请查看此链接:
关于css - 需要下拉菜单在页面加载时具有一定的宽度，但在单击时显示完整的内容长度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5406726/