存档

文章标签 ‘下拉列表firefox宽度’

指定下拉列表在firefox中的宽度

2008年11月21日
793 views 没有评论

很多时候由于下拉框的长度过长,我们会指字它的宽度,截取掉超长部分后面的内容.

在IE下,我们只要指定select的宽度即可.如:

1
2
3
4
5
6
7

<select name="ddlDept" id="ddlDept" style="width:80px;">
<option>上海 - 物业资讯部</option>
<option>北京 - 物业资讯部</option>
<option>重庆 - 物业资讯部</option>
<option>深圳资讯科技部</option>
<option>电脑部</option>
</select>

其实在firefox下面也很简单,使用如下方法即可.

1
2
3
4
5
6
7

<select name="ddlDept" id="ddlDept" style="width:80px;overflow-x:hidden;">
<option style="width:80px;overflow-x:hidden;">上海 - 物业资讯部</option>
<option style="width:80px;overflow-x:hidden;">北京 - 物业资讯部</option>
<option style="width:80px;overflow-x:hidden;">重庆 - 物业资讯部</option>
<option style="width:80px;overflow-x:hidden;">深圳资讯科技部</option>
<option style="width:80px;overflow-x:hidden;">电脑部</option>
</select>

可以简写为如下:

1
2
3
4
5
6
7
8
9
10
11

<style type="text/css">
#ddlDept{width:80px;overflow-x:hidden;}
#ddlDept option{width:80px;overflow-x:hidden;}
</style>
<select name="ddlDept" id="ddlDept">
<option>上海 - 物业资讯部</option>
<option>北京 - 物业资讯部</option>
<option>重庆 - 物业资讯部</option>
<option>深圳资讯科技部</option>
<option>电脑部</option>
</select>

CSS/XHTML ,