Make collage on desktop equal sizes on both sides

[elementsofearth]

I’m using the craft theme, and on the desktop site, the collages are different sizes, as seen below:

I want them to be equal sizes, like how they are on the mobile site, as seen below:

How do I do this? I’m aware that I’ll have to change some code, as now the only option to change it on desktop is “left large block” or “right large block”.

My website is www.elementsofearth.ie

[AvadaCommerce]

Hi @elementsofearth ,

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/collage.css->paste below code at the bottom of the file:

@media (min-width: 750px){
  .collage {
    grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  }
  .collage__item--right:nth-child(3n - 2) {
    grid-column-start: 1 !important;
  }
  .collage__item--right:nth-child(3n-1):last-child {
    grid-column-start: 2 !important;
  }
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.

Best regards.

[elementsofearth]

Thanks so much for the reply. That worked perfectly for the first collage on my site, but it didn’t apply to all of them, any idea why? Image below

[NancyL]

I’m trying to do the same, but the suggested code had no effect. My theme is unpublished, but that shouldn’t matter, should it?

[olerad]

Try setting the right image as the large one, worked for me