How am I supposed to write superscript text?

Question

I have an app which contains plenty of figures or letters in superscript. I noticed that

 X<span style="vertical-align: super;">3</span>

and just using sup tag around the figure 3 both yield X³ in my app.

But only the sup tag yields X³ on SO. Does it mean I should stick with the latter? What are the differences, pros and cons, if any?

Edit: I have checked http://www.w3schools.com/tags/tag_sup.asp and http://www.w3.org/TR/html-markup/sup.html . I don't seem to see any differences.

Accepted Answer

Just use <sup>super</sup>,

As you have seen in the reference from W3C the sup tag is just a routine for the CSS:

sup {vertical-align: super;font-size: smaller;}

Pros: It works across all platforms and this is what it's intended for. Also provides semantic meaning to screen readers and other 'bots.

Cons: Some people just love to do it themselves in CSS.

Edit: And full credit to j08691 - for this very succinct comment:

SO filters what code you can use, and it has no bearing on what you should use in your own projects