The default Twenty Twenty theme content area uses less than the full width of the screen, especially on a laptop or computer screen. The content area can be customised by increasing its width or even decreasing it.

The default width of the content area.

Video tutorial on how to increase the width of the content area.

The width of the content area increased.

The increased width of the content areas should work throughout the site (e.g. single pages, single post & blog archives).

Where and how to increase the width of the content area:

In WordPress Admin > Appearance > Edit CSS.

Enter the CSS code below and Publish the update.

  • Update the max-width 56rem value to 87rem to make the content 50% wider.
  • Update the width 4rem value to 8rem to double the width of the spaces to the left and right of the content area.

The CSS code:

.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
    max-width: 87rem;
    width: calc(100% - 8rem);
}

 

Post Photo by Michael Baird on Unsplash

Bharat Karavadra

About Bharat Karavadra

"I research and share leading-edge information, tools and exercises to help people transform and heal their life situations."

Comment, ask or share something...

Do NOT follow this link or you will be banned from the site!