How to set width of a multiple select?

Question

I want to set default width of multiple select elements :

How to do that ?

Answer 1

Try this,

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

or

<select multiple="multiple" style="width: 10em;">

Answer 2

The same way as any other element. You write a selector that matches the element (e.g. a select element with a multiple attribute) and then use the width property.

Width applies by default to replaced inline elements (such as selects).

select[multiple] {
    width: 7em;
}

Answer 3

Try This in css

select[multiple=multiple] {width: <default width you want>px ;}

Answer 4

Take a look at the max-width property on style.

Ex:

<select name=countries  style="max-width:90%;">
 <option value=af>Afghanistan</option>
 <option value=ax>Åland Islands</option>
 ...
 <option value=gs>South Georgia and the South Sandwich Islands</option>
 ...
</select>  

More information: How to control the width of select tag?