HTML select элемент с фиксированной шириной и полосами прокрутки

Это, вероятно, основной вопрос CSS, но я не свободно владею CSS и просто, кажется, иду по кругу.

вот что у меня есть на английском языке: у меня есть фиксированный элемент выбора ширины 400px. Текст для каждого из параметров не вписывается в эту ширину 400px. Я не получаю горизонтальную полосу прокрутки, она просто отрезает текст. Как мне получить полосу прокрутки?

вот что у меня есть в HTML / CSS:

<div>
  <select style="width=400px">
    <option>this text is too wide to fit and gets cut off.....</option>
    ...
  </select>
</div>

Я пробовал свойство overflow, но я либо использование его неправильно или он не работает на элементе select.

Как получить горизонтальную полосу прокрутки?

3 ответов


элементы формы, как известно, трудно стиль.

для настройки ширины у вас есть небольшая опечатка. Вам нужно

<select style="width: 400px">

в противном случае, я думаю, что горизонтальные полосы прокрутки не могут быть достигнуты с помощью обычного select элемент. Вам придется прибегнуть к альтернативе на основе JavaScript, такой как SexyCombo, который может быть настраиваемым, чтобы иметь полосы прокрутки. Дополнительные опции здесь:11 плагинов jQuery для улучшения HTML Выпадающие


  1. он должен быть!--0--> (не "width=")
  2. обычный HTML-select не имеет полосы прокрутки, независимо от того, что вы делаете:)

вы используете встроенный синтаксис css вы должны использовать style= " width: 400px;"

и если вы используете множественный выбор, вы просто используете

<select multiple style="width: 400px;">