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

Question

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

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

Answer 1

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>

Answer 2

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.

Answer 3

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):

<style>
select, option { 
  -webkit-font-feature-settings: "ordn";
  -moz-font-feature-settings: "ordn";
  font-feature-settings: "ordn";
  font-family: Calibri;
}
</style>
<select>
<option>24th
</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.

Answer 4

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.

Answer 5

You can write this way,

string item=HttpUtility.HtmlDecode("ml/min/1.73m²")

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