réduire la largeur de sélection, boîte multiple

Question

L'un des éléments de la multiple boîte de sélection est beaucoup plus longue que les autres, est-il un moyen de le pirater pour rendre la largeur de celui-ci plus petit

<select size="1"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

Answer 1

Vous pouvez faire ceci avec CSS, soit en style en ligne ou en utilisant une classe.

Avec un style en ligne:

<select style="width: 50px;"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

Utilisation d'une classe:

<select class="narrow"> 
<option>item</option> 
<option>item</option> 
<option>item is really long</option> 
<option>item</option> 
</select> 

Et dans votre fichier CSS ou stylesheet intégré:

.narrow { 
width: 50px; 
} 

Bien sûr, le changement 50px à quelle que soit la largeur dont vous avez besoin.

Answer 2

Vous pouvez définir la largeur à l'aide de CSS. Si vous ajoutez une classe à la balise select, par exemple « foo », vous pouvez alors ajouter css:

select.foo { 
    width: 200px; 
} 

Si vous voulez peut utiliser un style en ligne (pas recommandée):

<select style="width: 200px";> 
    <option>... 
</select> 

Answer 3

Essayez ceci, fonctionne dans FireFox mais pas dans IE:

<STYLE type="text/css"> 
    OPTION.shorter{ font-size:8px;} 
</STYLE> 

<select size="1"> 
<option>item</option> 
<option>item</option> 
<option class="shorter">item is really long</option> 
<option>item</option> 
</select>