Increase content width on a single page

Hello,

Here is how to change content width for a single page (disclaimer, I am not a web developer):

Step 1
Find the page ID of the page you want to edit. Instructions to find it here.

Step 2
Add this custom CSS, replacing the ## with the page ID:

div.section-inner.post-##.page.type-page {
	width: 200px;
}

Edit: replace 200px with whatever width you want your content to be (sorry I’m writing this while sleepy)

Peace

• This reply was modified 6 years, 2 months ago by carbybarby838.

carbybarby838,
Thanks very much for this. While this works for reducing, unfortunately there seems to be a max-width constraint.

I had previously found somewhere on this forum the following which increased width globally:

.section-inner.medium { max-width: 840px; }
.section-inner.thin { max-width: 900px !important; }

.section-inner .section-inner {
width: 100%;
}

Have tried to adapt it with your page id code but without success. Any ideas much appreciated.
Brilliant tip on the page id – Thanks…

There might be a neater way to do this but see if this works:

.section-inner.post-##.page.type-page.status-publish.hentry.missing-thumbnail > div {
	max-width: 1000px;
}

.section-inner.post-##.page.type-page.status-publish.has-post-thumbnail.hentry.has-thumbnail > div {
	max-width: 1000px;
}

Disclaimer: I’m not a professional web developer

• This reply was modified 6 years, 2 months ago by carbybarby838. Reason: Realized styling "p" was unnecessary
• This reply was modified 6 years, 2 months ago by carbybarby838. Reason: Realized second selector could be shortened

carbybarby838,
Excellent.

.section-inner.post-##.page.type-page.status-publish.hentry.missing-thumbnail > div {
max-width: 1000px;
}

.section-inner.post-##.page.type-page.status-publish.has-post-thumbnail.hentry.has-thumbnail > div {
max-width: 1000px;
}

Works perfectly even using % instead of px.
Don’t know how you arrived at the solution, I can’t make sense of it.
Thanks a million…

Resolved thanks