Skip to content

Instantly share code, notes, and snippets.

@3D-I
Forked from unruthless/CSS for <sup> and <sub>
Created March 28, 2018 19:11
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save 3D-I/667e5a8cc54473d547dcaf3aba09860f to your computer and use it in GitHub Desktop.
Save 3D-I/667e5a8cc54473d547dcaf3aba09860f to your computer and use it in GitHub Desktop.
CSS for <sub> and <sup>
sub, sup {
/* Specified in % so that the sup/sup is the
right size relative to the surrounding text */
font-size: 75%;
/* Zero out the line-height so that it doesn't
interfere with the positioning that follows */
line-height: 0;
/* Where the magic happens: makes all browsers position
the sup/sup properly, relative to the surrounding text */
position: relative;
/* Note that if you're using Eric Meyer's reset.css, this
is already set and you can remove this rule */
vertical-align: baseline;
}
sup {
/* Move the superscripted text up */
top: -0.5em;
}
sub {
/* Move the subscripted text down, but only
half as far down as the superscript moved up */
bottom: -0.25em;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment