选择下拉宽度 - Chrome 问题答案

【问题标题】：Select drop down width - Chrome issue选择下拉宽度 - Chrome 问题
【发布时间】：2013-02-20 19:03:51
【问题描述】：

我想控制<option> 下拉列表的宽度<select>。默认情况下，浏览器会在<option> 中计算较大的文本并容纳下拉菜单。在网站上看起来不太好。我尝试了以下 CSS sn-p 并发现在 FF 中工作。

select{
    width : 120px;
}
select option {
    width : 90px;
}

唯一的问题是 Chrome。如果有任何解决方法，您能否告诉我。

Demo

【问题讨论】：

Windows XP SP2、Google Chrome 25.0、Firefox 12.0
相关但未答复的帖子：CSS Select Dropdown Option

标签： html google-chrome css drop-down-menu width

【解决方案1】：

谷歌搜索结果并不适合我。我只省略了脚本选项。以下代码可以解决问题..

/* To trim the charaters in the option list */
    var optLen = $('#country option').size();
    //console.log("Total length is :" +optLen);
    for(var i=0; i<optLen; i++){
        var txt = $('#country option').eq(i).text();
        //alert(txt);
        txt = txt.substring(0,20);
        //alert(txt);
        $('#country option').eq(i).text(txt);
    }

Updated Demo

【讨论】：