Stretch, resize and fill the screen on masonry blog

#1

Hi,

I’m using Sydney on a website of mine. I’m using an archive page, set to Masonry type blog, to show my portfolio and blog posts on two different categories. However the posts/images are not resizing and filling the grid correctly to stretch on both sides of the screen. On wider screens, it seems that I can even fit around 6 columns, however it is fixed to 3, I guess.

The following doesn’t work either, it successfully increases the column count but messes with the alignments.

    body.blog div#content, body.archive div#content {
       column-count: 4;
    }

Is there a work around for that? Can you help?

Here is the link to my blog pages:
https://egegoksu.com/portfolio/
https://egegoksu.com/icses/

Thank you.
Gokec

#2

Hellok Gokec,

If I got what you described correctly, you would add this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 1025px) {
      .masonry-layout .hentry {
        width: 16.6666666667% !important;
      }  
    }

Regards,
Kharis