У меня есть listbox, и я хочу уменьшить его ширину.
Вот мой код:
<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 (последняя версия). Может ли кто-нибудь подсказать мне, как я могу уменьшить ширину
выпадающего списка в Firefox?
Попробуйте этот код:
<select name="wgtmsr" id="wgtmsr">
<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>
CSS:
#wgtmsr{
width:150px;
}
Если вы хотите изменить ширину опции, вы можете сделать это в своем css:
#wgtmsr option{
width:150px;
}
Возможно, у вас есть конфликт в правилах css, которые переопределяют ширину вашего select
[DEMO][1]
Ширину выпадающего сама по себе не может быть установлен. Это's ширина зависят от параметра-значения. См. Также здесь ( jsfiddle.net/LgS3C/ )
Как выбрать окно, похоже, тоже в зависимости от Вашего браузера.
Вы можете построить свой собственный контроль или использовать Select2 https://select2.org
попробуйте аргумент `!important', чтобы убедиться, что CSS не конфликтует с другими указанными вами стилями. Также использование reset.css полезно перед добавлением собственных стилей.
select#wgmstr {
max-width: 50px;
min-width: 50px;
width: 50px !important;
}
или
<select name="wgtmsr" id="wgtmsr" style="width: 50px !important; min-width: 50px; max-width: 50px;">
Создайте css и установите значение style="width:50px;"
в коде css. Вызовите класс CSS в выпадающем списке. Тогда все будет работать.
Это:
в <выберите стиль=и"ширина: XXXpx;" и>
ХХХ = любое число
Отлично работает в Гугл Хром или V70.0.3538.110
Если вы хотите контролировать ширину список, который падает вниз, вы можете сделать это следующим образом.
УСБ
#wgtmsr option {
width: 50px;
}