How to get cross browser <sup> without intrerupting line height?

How to get cross browser <sup> without interrupting line height?

I tried vertical-align:top but it looks ok in FF 3.6 and IE but not in FF 3.0.

How to get consistent in size (size of superlative text) and position of <sup> identical in all browser开发者_开发百科s without interrupting line height.

I'm using <sup> to indicate footnote? not to show power

<p> Stackoverflow is killing<sup>10</sup> experts-exchange</p>

---

Your best chance for a consistent rendering are real superscripts:

HTML

<p>Stackoverflow is killing<span class="unicode">¹⁰</span> experts-exchange</p>

CSS

.unicode
{
    font-family: 'Lucida Sans Unicode', 'DejaVu Sans', 'Arial Unicode MS';
}

Live

Stackoverflow is killing¹⁰ experts-exchange

---

sup {
    vertical-align: super;
    height: 0;
    line-height: 1;
}

If that doesn't work, you can take it a bit further..

sup{
    height: 0;
    line-height: 1;
    vertical-align: baseline;
    _vertical-align: bottom;
    position: relative;
    bottom: 1ex;
}

---

vertical-align: text-top;