Superscript OTF doesn't work in adobe program

[hrftype (Tan Sueh Li)]

Hello, I’ve added superior numbers to my font, it works well in Glyphs when I apply the superscript feature to the Glyphs file.

However, it doesn’t work when I’m testing in the Adobe programs with the superscript button shortcuts in the top menu bars and also at the character panel OpenType. It creates a faux superscript. I can only get the right superscript by manually taking it from Glyphs panel.

Please advise how to solve this…? Thanks much!

[FlorianPircher]

Is there a superscript item in the OpenType submenu (at the top of your screenshot)? Use that one instead.

[hrftype (Tan Sueh Li)]

Thanks Florian, it works in Adobe Programs with the OpenType submenu! Wondering if the font will be used in web environment, will this work as well? Or you have any advice what is the proper way to bring out superscript for web? Thanks so much!

[FlorianPircher]

On the web there is a similar issue. In HTML, superscript text is written as

HO<sup>2</sup>

The default CSS styles that web browsers apply for the sup element reduce its font size and move its baseline up:

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

You again get faux superscript text.

Use the following CSS code to get proper OpenType superscript text:

sup {
    font-size: inherit;
    vertical-align: inherit;
    font-variant-position: super;
}

[hrftype (Tan Sueh Li)]

Thank Florian so much for your very helpful info