CODEWITHSUNDEEP
htmlcssstyling
user1206479
user1206479

Reputation: 79

Does anyone know how to add superscripts in the option tag of <select>

Does anyone know how to add superscripts in the option tag of 

<select name=" ">
    <option value=" ">24<sup>th</sup></option>
</select>

Upvotes: 7

Views: 14513

Answers (6)

sameendra krovvidi
sameendra krovvidi

Reputation: 1

You can do it by using span Check it here

Upvotes: -1

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201758

For completeness, and for the future, I mention the possibility of using OpenType features of a font, via font-feature-settings in CSS. Using the ordn feature, you can specify that superscript letters be used from the font, if available. Support in browsers and fonts is still very limited, but the following works in sufficiently new browsers on sufficiently new versions of Windows (which have the “C fonts” like Calibri installed):

select,
option {
  -webkit-font-feature-settings: "ordn";
  -moz-font-feature-settings: "ordn";
  font-feature-settings: "ordn";
  font-family: Calibri;
}
<select>
  <option>24th</option>
</select>

This can only be used if all letters in the option content are to be shown as superscripts.

The approach degrades gracefully: when the technique does not work, the rendering just falls back to showing “24th” normally.

Upvotes: 2

Ilmo Euro
Ilmo Euro

Reputation: 5135

If your users have the appropriate fonts (here's a list), you can use the Unicode superscript characters:

<select name=" ">
  <option value=" ">24&#x1D57;&#x02B0;</option>
</select>

Upvotes: 12

Milind S. Patil.
Milind S. Patil.

Reputation: 21

You can write this way,

string item=HttpUtility.HtmlDecode("ml/min/1.73m&amp;#178;")

for more information on superscript you can see this link http://symbolcodes.tlt.psu.edu/bylanguage/mathchart.html#super

Upvotes: -3

Walter Mundt
Walter Mundt

Reputation: 25271

If you set the document encoding to UTF-8 or use unicode escapes you could use Unicode superscripts for this, e.g.:

<option>25ᵗʰ</option>

However, this may not display properly at all in some fonts or browsers and generally isn't as nice-looking as using the HTML/CSS superscript functionality.

Upvotes: 2

Sandy8086
Sandy8086

Reputation: 643

Because a select box anctual often an OS object rather than soemthing that is draw by the browser you are limited to what this object can do.

It is a Listbox or Combobox on Windows and these do not have the capability of drawing super scripts.

I am afraid you will have to live without being able to do it.

Upvotes: -1

Related Questions