web-dev-qa-db-fra.com

Comment puis-je définir la largeur de l'élément HTML <select>, sans tenir compte de la largeur de chaque option

En fait, je sais que la case de sélection width est définie par l'option la plus longue de la liste, mais je souhaite augmenter la longueur (largeur) d'un élément select html.

J'ai également cherché et je comprends ce code style="max-width:70%" peut fonctionner mais cela ne fonctionne pas pour moi.

Le code ci-dessous est le mien:

<select class="form-control"style="max-width:70%">
    <option value="1">option 1 </option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
</select>
htmlhtml-selectdropdown
10
Niusha Ghanbari

vous devez utiliser l'attribut width au lieu de max-width. corrigez votre code à l'exemple ci-dessous:

<select class="form-control"style="width:150px">
    <option value="1">option 1 </option>
    <option value="2">option 2sdsdsdsd</option>
    <option value="3">option 3</option>
</select>
11
Sheida Mohassesi

Vous devez utiliser la propriété css min-width pour augmenter la largeur de la liste déroulante quelle que soit la largeur des options.

html:

<select class="dropdown">
    <option value="1">option 1 </option>
    <option value="2">option 2</option>
    <option value="3">option 3</option>
</select>

css:

.dropdown{
  min-width: 200px;
}
4
AkshayM