Существует ли способ зафиксировать ширину выпадающего списка?
Вот то, что я получил:
<select id="box1">
<option>ABCDEFG</option>
</select>
<select id="box2">
<option>ABCDEFGHIJKLMNO</option>
</select>
У меня есть 2 различных Выпадающих списка. Так как ширина выпадающего списка зависит от ширины самого длинного текста в опции, я заканчиваю с 2 выпадающими списками с 2 различными ширинами. Это заставляет мою веб-страницу выглядеть глупой.
То, что я хочу, должно установить его так, чтобы оба из моих выпадающих списков имели ту же ширину (я предпочел бы, чтобы ширина была очень длинна, так, чтобы даже самый долгий объект не был усеченным).
4 ответа
Вы можете использовать CSS, чтобы установить ширину вашего элемента , но получить ширину до точно соответствуют заданному количеству символов.
Почему вы хотите, чтобы текст опции был обрезан?
Длина относится к количеству видимых опций ?? В таком случае используйте размер . Вот документация . Дайте мне знать, если вы имеете в виду другое.
После РЕДАКТИРОВАНИЯ: Установите ширину для выбора. Но было бы сложно установить ширину, чтобы отображалась только определенная длина. Второе редактирование: Вы не можете сделать это с помощью CSS, вам нужно использовать javascript. При каждом изменении выбора вы должны видеть, какой из двух элементов имеет максимальную ширину, и устанавливать то же самое для другого.
Вам необходимо использовать JavaScript после загрузки страницы (укажите свой список id = "listA" ):
document.getElementById('listA').length = 20
Это эффективно усечь его до 20 элементов.
Используйте следующую строку. Она фиксирует ширину раскрывающегося списка.
<select id='box1' style='width: 200px;'>
<select id='box2' style='width: 200px;'>
Если вы хотите указать ширину с помощью CSS, вы можете использовать следующий код.
#container select {
width: 150px;
}