Reduce page width

Hi there,

Try this CSS:

.no-sidebar .site.grid-container {
    max-width: 800px;
}

That is absolutely perfect. Thank you so much! :-)

No problem at all :)

Ah - that doesn't change the pages that use sections.

Is there a way to change these also?

Hi there, we can use update the CSS to this:

.no-sidebar .site.grid-container, .generate-sections-enabled:not(.home) .site.grid-container {
    max-width: 800px !important;
}

That doesn't have any affect on the pages with sections.

Also - my home page uses sections, but I don't want that to be reduced in width - is it easy to exclude the home page?

I edited the code above, can you try that.

That's reducing the width of page text, but there are two issues:

1. It also changes the home page (which I don't want to alter) and
2. It reduces the background colour of the sections to an 800px width rectangle. I wanted the colour to remain at full width.

I'll have a play around and see if I can modify it, but if you have any other suggestions please let me know!

Hi there,

if you can provide a link to the site then that would be helpful, you can edit your original post and use the Site URL field for privacy.

It's https://simpledays.co.uk

Thank you :-)

OK, let give this a shot, the logic: if there is no sidebar and not on a Section page then reduce the entire content width, if on a Section page that is not the home page just reduce the Sections container....

.no-sidebar:not(.generate-sections-enabled) .site.grid-container,  .generate-sections-enabled:not(.home) .generate-sections-inside-container {
    max-width: 800px !important;
}

I think that's it. All looks great.

Thank you so much :-)

You're welcome, glad we got there!