Code for side by side images in mobile view?

Hi!

I have this collage of images on desktop view that I built with blocks.

Obviously this doesn't translate to mobile view so I was trying to add some code to change it just on mobile view. 

So far I've managed to reduce the size of the images just on mobile, as they looked massive before, but I'd like to be able to display some of them side by side, at least 2 or 3 of them - is there a code for this that includes block IDs, so that I can select specific images I would like to pair up? This is the code I've used so far:

Thanks!

What is site url?

8 hours ago, tuanphan said:

What is site url?

https://hywellivingstone.com 🙂

side by side, it look like not possible, but you want 1 - 2 - 1 - 2, it is possible

or 3 items/row is possible

1 hour ago, tuanphan said:

side by side, it look like not possible, but you want 1 - 2 - 1 - 2, it is possible

or 3 items/row is possible

That sounds good, I'd be happy to try both! Do you know what the code would be for both of them?

21 hours ago, hywel said:

That sounds good, I'd be happy to try both! Do you know what the code would be for both of them?

Add to Design > Custom CSS

@media screen and (max-width:767px) {
div#page-64b5c4dd2ac8d15fb5d21e8d .span-2:nth-child(3) .image-block, div#page-64b5c4dd2ac8d15fb5d21e8d .span-2:nth-child(5) .image-block {
    clear: none !important;
    width: calc(~"50% - 34px") !important;
    float: left !important;
}
}