CODEWITHSUNDEEP
html
Jonathon
Jonathon

Reputation: 2699

HTML Select Option, text formatting

Do any of the modern browsers support any type (any type at all) of internal text formatting (so that part of a single option is formatting differentially). Different side, colour, strength, subscript, anything.

So far it seems that Chrome, at least, just deletes any tags put inside of option tags.

I am looking for something to accomplish this style of result (without having to deal with canvases):

<option value="8470621">Corey Perry <i>Anaheim Mighty Ducks</i></option>

OR

<option value="8474141"><b>Patrick Kane</b> Chicago Blackhawks</option>

Upvotes: 11

Views: 24470

Answers (5)

abe1432181
abe1432181

Reputation: 1316

There is a javascript/css solution on https://methodfish.com/Projects/MFSelector/docs/README that takes markdown input and fakes a drop down on screen to match

enter image description here

Upvotes: 0

user12170141
user12170141

Reputation: 31

I found this method to overlay text in list, but it probably will not help with :)

var result ="";
$.each(text.split(""), function () {
result += this + "\u20EB";
});

Upvotes: 0

Itay
Itay

Reputation: 16777

The answer is no.

As you can see on MDN:

Permitted content: Text with eventually escaped characters (like &eacute;).

There are alternatives combining other tags, but not select and option.

For further reading:

Upvotes: 1

Matthew R.
Matthew R.

Reputation: 4350

There is currently no support for nested HTML tags within options. The closest formatting element you can use is <optgroup> which will group options into sections.

What you could do is use a javascript replacement like Select2 or Chosen to style the elements. It isn't native, but it does support HTML.

Upvotes: 12

insertusernamehere
insertusernamehere

Reputation: 23580

As the specification "4.10.12 The option element" states is the content model of an <option>-element text only.

Upvotes: 3

Related Questions