Link to home
Start Free TrialLog in
Avatar of ITsolutionWizard
ITsolutionWizardFlag for United States of America

asked on

html5 select

i have extremely option text in the last option and I want to limit to width to 200px.
How can I do that?

<option value="value1">value1</option>
<option value="value2">value2</option>
<option value="extremely_long_value3">extremely_long_valuesdfgsdfgsdgsdgsdfgsdfgsdfgsdfgsdfgsdfsdfsdfgsdfsdfsdfsdffagsgfadsfgsdfgsdfgsdf3</option>
Avatar of Misbah
Flag of United States of America image

here is how you limit the width to 200px by modifying the first line to be like this :
<select style="width: 200px">

Open in new window

Avatar of Anwar Saiah
Anwar Saiah

<select id="myselect">

#myselect{width:200px; text-overflow: ellipsis;}
Avatar of ITsolutionWizard


no. I want to limit the <option> not the <select>.
It is just one of the <option> is too long/width
well then instead of:
<select id="myselect">
<option id="myoption">
#myoption{width:200px; text-overflow: ellipsis;}
not working
select boxes are usually the width of it's longest option, unless otherwise specified. So you would need to specify a width for the select box, as Misbah suggested.
I Just tested it on jsfiddle and it works.
What browser do you use?
Avatar of Anwar Saiah
Anwar Saiah

Link to home
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial