Menu
I've got a simple input tag (which I prettify using Bootstrap) in which I now want to place a superscript (to display "m2"). The problem is that when I do this:
<input class="form-control" name="gla" placeholder="m<sup>2</sup>" type="text">
the placeholder literally shows this: m<sup>2</sup>
Does anybody know how I can properly display the superscript? All tips are welcome!
302
Superscript: The <sup> tag is used to add a superscript text to the HTML document. The <sup> tag defines the superscript text. Superscript text appears half a character above the normal line and is sometimes rendered in a smaller font.
Apply superscript or subscript formatting to text Select the character that you want to format as superscript or subscript. On the Home tab, in the Font group, pick the Font Dialog Box Launcher. On the Font tab, under Effects, select the Superscript or Subscript check box.
<sup>: The Superscript element The <sup> HTML element specifies inline text which is to be displayed as superscript for solely typographical reasons. Superscripts are usually rendered with a raised baseline using smaller text.
Note. The HTML <sup> element is found within the <body> tag. The <sup> tag is used to comply with typographical standards or conventions. The <sup> tag is generally used to specify exponents such as m2 and ordinal numbers such as 1st, 2nd or 3rd.
How about using HTML Entities
<input class="form-control" name="gla" placeholder="m²" type="text">
Yes it works
72
You could just use the UTF-8 character for superscripted ². Also be sure to set the charset of the document to UTF-8.
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<input class="form-control" name="gla" placeholder="m²" type="text" />
</body>
</html>Also this answer might be of help.
29
Within an attribute value, you can use characters just like in document content (except for the quote character used as attribute value delimiter). This means that you can write the superscript two character as such, or using a named character reference, or a numeric reference. When using the character as such, you need to make sure that the character encoding is properly declared (corresponds to the actual encoding).
<input class="form-control" name="gla" placeholder="m²" type="text"><br>
<input class="form-control" name="gla" placeholder="m²" type="text"><br>
<input class="form-control" name="gla" placeholder="m²" type="text"><br>
<input class="form-control" name="gla" placeholder="m²" type="text"><br>If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
