How to break up the value present inside the <option> tag in HTML?

Question

Hi All:
I have doubt regarding tag in html. In the HTML page, a drop down list need to display in the part of some fixed width. Problem i am facing is, there is one option in drop down list has some lengthy statement which causing the entire dropdown list extended part. So i want to break the particular option value to display in two lines. How to do that in HTML?. Thanks in advance.

Eg.:

 <select name="Greetings">
<option value="">Select Greeting</option>
<option value = "2010">Welcome</option>
<option value = "2020">Welcome to the land of peace and love</option>
 </select>

How to break the value of option2??

Answer 1

No, you can't do this.

You can have a custom dropdown menu. This is a good one.

jQTransform

Answer 2

You can't break the text up using the HTML select element.

But, there are 3rd party dropdown list controls available from vendors like Telerik - Telerik ASP.NET Ajax ComboBox, you can try them out. If you google a bit, you'll also be able to get some free controls which can do the same for you.

Or you can rig your own control using DIVs and a little bit of JavaScript.

One more suggestion is using the same select element, and using the title attribute on the option elements like this -

<select name="Greetings">
    <option value="">Select Greeting</option>
    <option value = "2010">Welcome</option>
    <option value = "2020" title="Welcome to the land of peace and love">Welcome to the land of peace and love</option>
</select>

The title element will show a tooltip containing the whole text, when the user hovers his/her mouse over the dropdown option.