Are Multi-line Options in Html Select Tags Possible?
It is not possible using html select control.
You can use a div that can act as a dropdown list using JavaScript and css.
How can I build a select with multiline options?
<option>
tags have limited styling capabilities and do not support formatting.
You can use a JavaScript-based alternative. There are plenty out there if you look around.
HTML select option multiline value
Please try jQuery-Selectric this plugin which possibly solve your issue.
Line Break in HTML Select Option?
No, browsers don't provide this formatting option.
You could probably fake it with some checkboxes with <label>
s, and JS to turn it into a fly out menu.
Can you have multiple lines in an option element?
It's a particular case of displaying HTML tags inside an <option></option>
element. As far as I know, browsers behave very differently in this area (Firefox displays even images, other browsers ignore most or all tags) and there isn't a cross-browser solution. You'll probably need to emulate it with JavaScript and a different markup.
At http://www.w3.org/TR/2011/WD-html-markup-20110113/option.html they say:
Permitted contents: normal character
data
... which is defined at http://www.w3.org/TR/2011/WD-html-markup-20110113/syntax.html#normal-character-data
The spec is hard to understand, as usual, but I understand that you cannot insert a literal <
(i.e., an HTML tag such as <br>
). I cannot find where it defines the behaviour with blank space but most browsers appear to collapse it.
Can an Option in a Select tag carry multiple values?
One way to do this, first one an array, 2nd an object:
<select name="">
<option value='{"num_sequence":[0,1,2,3]}'>Option one</option>
<option value='{"foo":"bar","one":"two"}'>Option two</option>
</select>
Related Topics
Link to an Element Within The Current Page
Detecting 'Transform: Translate3D' Support
Wrapping Text Around an Image with Indentation and Justify
Can't Show Some Websites in Iframe Tag
HTML Embed Autoplay="False", But Still Plays Automatically
Which Dom Elements Can Be Child of Tr
Bootstrap Full-Width Text-Input Within Inline-Form
HTMLagilitypack Drops Option End Tags
How to Define a Dynamic Mixin or Function Name in Sass
How to Make Firefox Auto-Refresh on File Change
Overlapping/Overlaying Multiple Inline Images
R Markdown HTML Number Figures
CSS Zigzag Border with a Textured Background
Apache Giving 403 Forbidden Errors