Выберите размер атрибута размера, не работающий в Chrome/Safari?
Как решить проблему, которая выбирает размер атрибута, например, в коде:
<select size="2">
<option value="0" selected="selected">Default</option>
<option value="1">select 1</option>
<option value="2">select 2</option>
<option value="3">select 3</option>
</select>
Как я могу заставить его работать в Chrome и Safari?
Ответы
Ответ 1
Это известная ошибка в браузерах webkit.
Самый простой способ заставить его работать так, как вам нравится в Chrome и Safari, - это вручную указать стиль самого выбора.
Вот рабочий jsFiddle.
select {
height: 36px;
font-size: 14px;
}
<select size="2">
<option value="0" selected="selected">Default</option>
<option value="1">select 1</option>
<option value="2">select 2</option>
<option value="3">select 3</option>
</select>
Ответ 2
Я использую атрибут size в HTML для "других" браузеров, а затем указываю внешний вид webkit в CSS. Доступны другие типы опций меню, текстовое поле - не единственное. И вам, возможно, понадобится испортить высоту на основе размера шрифта. Это делает его примерно одинаковым во всех браузерах.
CSS
select{
-webkit-appearance: menulist-textfield;
height: 45px;
}
Ответ 3
Я смог решить эту проблему, добавив опцию "несколько" к тегу выбора.
Ответ 4
Включить height: auto
и она должна работать.
<select size="2" style="height: auto">
<option value="0" selected="selected">Default</option>
<option value="1">select 1</option>
<option value="2">select 2</option>
<option value="3">select 3</option>
</select>
Ответ 5
Попробуйте использовать свойство css width
тега select:
select {
width:value px;
}