Pricing Process Reviews Contact

Divi Guy blog

Format superscript text in Divi

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

sub, sup {

  font-size: 75%;

  /* 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;

}

Need a hand?

Need help with your Divi website?

Book a Divi consultation and we can fix it together over Zoom, or ask for an estimate for bigger jobs.

7 Comments

  1. Hey, Thanks for this! Worked perfectly.

    Reply
    • Awesome! You’re welcome!

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

    Reply
    • Many thanks! Awesome. It solved my problem.

      Reply
  3. 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…

    Reply
  4. 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.

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

Search

Browse

More tips

Got a question?

Ask me anything

Stuck on something in Divi or WordPress? Ask away and I will reply by email, usually within 24 hours.

Ask a Question

Tell me about your project. The more details the better.

"*" indicates required fields

Make a payment

Got an invoice?

Pay an invoice, a deposit or a tip in about a minute. Card or PayPal, secure checkout, and I never see your card number.

Make a payment