For my homepage I am using a masonry grid with a colour overlay effect when scrolling over the image. It works fine on my mobile, but on a laptop and desktop the colour grid is larger than the image itself. It is stretched somehow. Is it possible to size it so that it matches the image?
I also wonder if it is possible to have more control over the positioning and spacing of images on a masonry grid when having not many images and quite a bit of space between them?
The mask area will only fit the grid size because your page is set to image-fit-gird option, you should set the mask size manually, please enter the custom CSS(“Appearance > Customize: Additional CSS”):