Set Blog column to different width?

Hello,

On all sections of a site, you are able to choose "section width", however in a section with the Blog column of blog posts, there is no such choice. My Single Column Blog takes up the whole width of the page, where I would like it very narrow on the site.

I already googled my issue and copy pasted multiple different codes into the custom CSS, but I can get nothing to work.

My site isn't live yet.
 

I added a screenshot

This tutorial shows how to change  7.1 blog post width wide or narrow. Code is not required and if still have some in your site trying to change the width, you should remove it.  

Thanks for the respond.

Unfortunately the video doesn't offer a solution, because, like mentioned in my post, I'm looking to change the width of my Blog Column and not the blog posts. The blog column is when you see an overview of the blog posts, before clicking to read one of them. In the video you linked to that page is shown at 0:09

It's this "grid" or in my case, list, I want to make narrower on my page.

This code has worked for many templates in custom css, you can change the width by adjusting the px number. 

section#container.blog {max-width: 960px;}

You may have to use this code instead: 

section#container.blog {max-width: 960px !important;}

This for some reason doesn't work when I type it into custom CSS. I've tried down to a 100px, but it stays full screen. I have no other custom CSS anywhere. I'm working with the Almar theme.

Would you have any other suggestions to a fix?

Yes, I do. it is more of a workaround. Put your blog page in the unlinked section of your site. Then create a new blank page in the regular part of your site. Add a blank section and in that section put a summary block pulling content from your blog page. Set the items to two or three however many your want, add spacers to each side of the block, adjust the column and gutter width you can pretty much  make it the exact width you want. I tested using the same template and it works. There is a 30 post limit per block but you can have more than one block on a page. 

On 2/17/2021 at 1:31 AM, najasierra said:

This for some reason doesn't work when I type it into custom CSS. I've tried down to a 100px, but it stays full screen. I have no other custom CSS anywhere. I'm working with the Almar theme.

Would you have any other suggestions to a fix?

Have you solved it yet? If no, can you share link to your site?

I was wondering about this too. I played around with coding and this is what worked for me. 

/* Blog width */
@media screen and (min-width:768px) {
.tweak-blog-alternating-side-by-side-width-inset .blog-alternating-side-by-side {
    padding-left: 15vw;
    padding-right: 15vw;
}
}

Two things to keep in mind. (1) 5vw might not be best for you (so you can adjust that of course). (2) My blog list is set to "alternating side by side." If you have a basic blog grid (for exampl), the code would be the following (I think):

/* Blog width */
@media screen and (min-width:768px) {
.tweak-blog-basic-grid-width-inset .blog-basic-grid {
    padding-left: 15vw;
    padding-right: 15vw;
}
}

Hope it works!