How to Reduce Words Per Line on Blog POSTS pages only (Ethos)?

[linghuchong]

Hey guys,

I’m a newbie to both Pro & Wordpress, but learning lots here.

Issue: I’m trying to reduce the number of words per line on all of the blog POSTS pages only.
Preferably, I’d like no more than 13-15 words per line. Would also like the text centered on the page. Trying to avoid sidebars for time being. But I can’t figure out how to do any of this?

Current settings: Content layout is set to full-width. Using the Ethos Stack with Pro theme.

For example, you’ll see that my blog post here fills the screen with text: http://thecounterstory.com/vision
BUT, I’d like to make it look like these guys at Medium: https://medium.com/@steve.yegge/why-i-left-google-to-join-grab-86dfffc0be84

You’ll see the words per line being about 13-15 words per line + text centered.

How do I change the words/per line globally on ALL blog posts + center the text?

I found similar support topics like:

Change sitewidth % for just the blog posts on mobile

How to force boxed instead of full width only on mobile

…But I couldn’t make the CSS or suggestions work for my case. (I’m also a newbie to CSS)

Thanks in advance.

[ruenel]

Hey There,

Thanks for writing in!

Do you want something like this?

If that is the case, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)

.single-post .x-main.full .entry-header,
.single-post .x-main.full .entry-content.content,
.single-post .x-main.full .x-comments-area {
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

Feel free to adjust the maximum width if needed.

[linghuchong]

Yes, that’s perfect!! Many thanks man. Wow, you guys are quick. Much appreciated.

[rad]

You’re most welcome!

[linghuchong]

hey guys, sorry quick follow-up: Can you kindly give me a similar CSS (similar to my original post + your reply) for an individual text container on a regular content page? (non-blog)

So, for the text container, I’d also like no more than 13-15 words per line + centered on the page.
(hoping to apply it to a single section here: http://thecounterstory.com/services/coaching )

I’ve played with the Pro padding & margins in the container + columns, but it doesn’t go far enough. And I don’t want to affect any other page globally, ideally.

Thanks so much!

[rad]

Hi there,

Since it uses a builder where some section has the full-width setting, then you can’t apply it there globally. You will have to be selective to which row should have the narrow container. Please inspect your section row (not the section itself but row), then go to its customize section and fine Inline CSS input field, then just add max-width: 700px;. It will be centered since the inner container is always centered.

Thanks!