What’s up with the <sup> tag? It’s a semantic way of marking up superscripts, but it acts funny in IE6 (are you surprised?).
You will notice here that the screenshot on the left looks a little cramped. Here is the fix:
sup {
text-align: vertical
}
If you want to move the number higher up, try decreasing the line height.
Hope this helps you!
2 Comments
This did not work for me.
If you want your ’s to go inline, not influencing any line-height, or acting “funny” in the IE6 do the following:
All browsers:
sup {
line-height: 0px; /* Fixes the Line-Height difference caused by */
}
IE6:
sup {
vertical-align: top; /* Overwrites the “super” attribute, which causes the Text to move under the baseline */
position: relative;
top: -2px; /* the “vertical-align: top” positions the text lower than “super” so you have to position the manually */
}
This worked for me quiet good!
sup {
line-height: 0px; /* Fixes the Line-Height difference caused by */
}
Whoops! I didn’t know HTML-Snippets are not filtered…
sup {
line-height: 0px; /* Fixes the Line-Height difference caused by sup’s*/
}
IE6:
sup {
vertical-align: top; /* Overwrites the “super” attribute, which causes the Text to move under the baseline */
position: relative;
top: -2px; /* the attribute “vertical-align: top” positions the text lower than “vertical-align: super” so you have to position the sup’s manually */
}