Hello James,

you can customize the sizing of the packery masonry portfolio grid by opening /js/scripts.js

and in function Portfolio(){ ... }

you will have the grid initialization:

var $container = $('#portfolio').packery({
     itemSelector: '.item',
     gutter:0,
    transitionDuration: "0.5s"
});

https://packery.metafizzy.co/options.html

Hi James,

plz open /css/portfolio.css and look for

.item {
    display: block;
    position: relative;
    box-sizing: border-box;
    z-index: 0;
    width: calc(50% - 40px);
    height: 28vw;
    margin: 50px 20px;
}

as I don't think you need styles for wide items

Hi James

try modifying directly in /css/portfolio.css

for 3 columns

.item {

     ...

     width: calc(33.33% - 40px);

     height: 18vw;

    ...

}

for 4 columns

.item {

   ...
    width: calc(25% - 40px);
    height: 14vw;

   ...
}

you may need to change the styles in responsive media breakpoints in the same file

@media only screen and (max-width: 767px) {
...
}

Hi, 

we need to inspect the portfolio page, if possible

Ok, closing this ticket