[Lloyd AParticipant]

Hello Support Team,

I have a problem and I’m hoping you can come to the rescue!

I would like to change the width of the content on individual pages, but not on the site as a whole, without affecting the width of the header.

I found one other support ticket with a similar subject and tried the CSS code. It reduced the content width, but the header width also decreased.

The page in question can be found here – http://www.ldaphotography.com/resources/pre-sets-and-actions/

Thanks a million!

[FriechModerator]

Hi There,

Thank you for writing in! You can add this on the Custom > Global CSS on Customizer

.page-id-7544 .x-container.max.width.offset {
	max-width: 60%;
}

Feel free to adjust the value.

Clear your caching plugin and browser’s cache before you preview the page.

Cheers!

[Lloyd AParticipant]

That’s worked perfectly, thank you!

One other follow up question – I will have a few of these pages, so is there a piece of code that I can use to apply the same settings to all of those pages, without having to retype the above, with each new page ID?

Thanks in advance!

[JadeModerator]

Hi Lloyd,

You can add a class to the body element of the page when you edit the page under Page Settings > Body CSS Class(es) to every page that you want to make the changes for. Please make sure they have a common class name then update the previous code to:

.the-class .x-container.max.width.offset {
	max-width: 60%;
} 

Hope this helps.

[Author]

Posts