我有一个列表框,我想减少它的宽度.
这是我的代码:
<select name="wgtmsr" id="wgtmsr" style="width: 50px;">
<option value="kg">Kg</option>
<option value="gm">Gm</option>
<option value="pound">Pound</option>
<option value="MetricTon">Metric ton</option>
<option value="litre">Litre</option>
<option value="ounce">Ounce</option>
</select>
此代码适用于IE 6,但不适用于Mozilla Firefox(最新版本).任何人都可以告诉我如何减少widthFirefox上的下拉列表？
也许这是一个简单的问题,也许不是.我有一个选择框,我用宽度硬编码.说120px.
<select style="width: 120px">
<option>REALLY LONG TEXT, REALLY LONG TEXT, REALLY LONG TEXT</option>
<option>ABC</option>
</select>我希望能够显示第二个选项,以便用户可以看到文本的全长.
像其他一切一样.这在Firefox中运行良好,但不适用于Internet Explorer6.
我有一个下拉菜单的大列表.一些选项具有非常大的文本.我想根据所选的选项制作所选元素的宽度.
如果所选选项为"已选择",则宽度应为120px或其他值.当用户选择"非常大的选择选项"时,<select>标签的宽度应该增加.
这是示例代码,我正在尝试做什么. http://jsbin.com/axaka4/edit
我希望select元素的默认选项值的宽度更短.当用户选择另一个选项时,select元素应调整自身大小,以便整个文本始终在元素中可见.
我已经在问题中找到了一个解决方案,根据选择的OPTION宽度自动调整SELECT元素的大小,但它不能用于bootstrap,我不知道为什么.
这是我的尝试:
$(document).ready(function() {
$('select').change(function(){
$("#width_tmp").html($('select option:selected').text());
// 30 : the size of the down arrow of the select box
$(this).width($("#width_tmp").width()+30);
});
});.btn-select {
color: #333;
background-color: #f5f5f5;
border-color: #ccc;
padding:7px;
}
select {
width: 60px;
}
#width_tmp{
display : none;
}<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css" rel="stylesheet"/>
<link href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css" rel="stylesheet"/>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script>
<div class="form-group">
<div class="input-group">
<span class="input-group-btn">
<select class="btn btn-select align-left">
<option>All</option>
<option>Longer</option>
<option>A very very long string...</option>
</select>
<span id="width_tmp"></span>
</span>
<input type="text" class="form-control" …javascript jquery html-select twitter-bootstrap twitter-bootstrap-3