This post/video started when I read an article by Neural DSP called How to get a good bass tone. And the headings are centered, with an orphan word hanging.

Title says "How to get a good bass tone", with word tone orphaned from the rest

It reminds me that when I built Elementor's homepage I had to manually enter line breaks to match the design:

H1 tag from Elementor’s homepage. The title says “Create a Website (line break) Design Your Future” with a <br> tag in between lines.
H1 tag from Elementor’s homepage

Never add manual line break tags (<br>) to your headings!

Balance all your headlines

If you want your headlines to balance automatically you can apply this CSS code to all headlines, and bring balance to the force:

h1, h2, h3, h4, h5, h6 {
    text-wrap: balance;

Use a class to balance specific headlines

You can also apply a class to specific headlines:

.balance {
    text-wrap: balance;

Use a class to balance and center headings

And if you want to center it, then:

  1. Set the amount of characters to your width (or any unit you see fit). I use 20ch for 20 characters wide.
  2. Then use margin auto to the left and right sides. Instead of using margin-right or margin-left use margin-inline-start and margin-inline-end respectively
.balance {
    text-wrap: balance;
    max-inline-size: 20ch;
    margin-inline-start: auto;
    margin-inline-end: auto;
    text-align: center;

You can also use heading levels (h1, h2 etc.) instead of a class.

Unlock exclusive web design tips and tricks! Join our mailing list for a monthly dose of inspiration delivered straight to your inbox.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
I will never send you spam. Unsubscribe at any time.

More videos


No next video
Back to all videos


No previous video
Back to all videos

Some of the links on this page are affiliate links, meaning I may receive a commission if you follow them. This allows me to continue providing free content and educational resources for you, and for you it changes nothing. Also, I 100% stand behind every product I recommend. Thank you for supporting my small business