Format superscript text in Divi

Nov 21, 2020 | Divi Tips | 5 comments

Add the following CSS code to the Divi theme options area or your child theme style.css file.

sub, sup {
  font-size: 25%;
  /* Zero out the line-height so that it doesn't
     interfere with the positioning that follows */
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  /* Move the superscripted text up */
  top: -1.25em;
}
sub {
  /* Move the subscripted text down, but only
     half as far down as the superscript moved up */
  bottom: -0.25em;
}

5 Comments

  1. Hi Mazz,
    There is nothing else to do, other than save the Divi options, unless you want to modify the CSS to suit your needs.

  2. Hi sorry I’m new to all this CSS stuff, I’ve added this code to the DIVI Options but what else should I do please? Might you do a step by step guide please? lol I’d really appreciate before I lose the will to live…

  3. sub,
    sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
    }
    sup {
    top: -0.5em;
    }
    sub {
    bottom: -0.25em;
    }

  4. Awesome! You’re welcome!

  5. Hey, Thanks for this! Worked perfectly.

Submit a Comment

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.