Centering blog content instead of making it full width after sidebar removal

[alikapadia]

This one might be too custom of a thing that I am trying to do here, but thought I’d still run it by the forum and see if there is a proper way to do this.

Basically, I would like my blog posts to not have any side bars however when I do so, the content area becomes full width causing a lot of text to show up in each line. This is not as reader friendly as I would like. I like how the site medium.com puts its article content, in smaller width content boxes with empty area on the left and right of the page. I would like something similar, no side bar, and the content area simply moves to the center without changing its width.

Here is an illustration of what I am trying to do http://glui.me/?i=rap7bk2xgtqkjrm/2013-11-28_at_4.59_AM_2x.png/

Can someone help me do this properly? Such that it doesn’t mess with the layout and items within the content area maintain their designated positioning.

Thanks in advance!

[Swift Ideas – Ed]

Sure, that makes sense!

If you wanted to just reduce the width of the content, then you’d want to use the following:

.has-no-sidebar article.type-post .body-text {
padding: 0 100px;
}
@media only screen and (max-width: 991px) {
.has-no-sidebar article.type-post .body-text {
padding: 0;
}
}

Or the whole article:

.has-no-sidebar article.type-post {
padding: 0 100px;
}
@media only screen and (max-width: 991px) {
.has-no-sidebar article.type-post {
padding: 0;
}
}

You can increase/decrease the width with the 100px value (which affects left and right spacing).

Hope that helps!

– Ed

[alikapadia]

That works! Thanks.

If I was to later use cols within my content area, is there a width value you would recommend that accommodates cols and the placement of other theme features the best? Maybe a value that renders the width same as the width of the content area when the side bar is present.

[Swift Ideas – Ed]

The columns are all percentage width, so that should work fine no matter what it’s set to!

– Ed

[alikapadia]

Thanks Ed!

[Swift Ideas – Ed]

No worries!

– Ed

[roorkee]

Hi, I just saw exactly my question so sorry in advance for asking in the wrong theme category.

How do you achieve this with Neighborhood?

Thanks

[Melanie – SUPPORT]

Hey, if you post up the url to the page where you’d like to achieve this I can gladly give you custom css 🙂