How do you subscript or superscript html text without affecting the paragraph line spacing?

Bit of a long title today but a simple request!

I have only one character in some text that I would like to subscript. Initially I used html 'sub' element which I can't deny does work but if you have multiple lines of text the line that displays the subscript will end up having a greater line height than the others which in my pedantic world caused nightmares!

Let's see if I can demonstrate here:

line₁ with a subscript number 1 after line
some other lines follow this one without any super or sub script features.
some other lines follow this one without any super or sub script features.

There is another way though which now allows me to sleep at night : ) hurrah. Simply use a span around your subscript item (or super) and set it style to:

position: relative;top: 0.3em;

from this you can obviously change the top value to choose the character position and in fact make it superscript. Here is the updated version below:

line1 with a subscript number 1 after line
and some superscript using a top of -0.3em easy.
some other lines follow this one without any super or sub script features.

better?!