How to get four-image banner like in Shop demo?

That does it! I realized I had to set the cell padding to zero, and that did the trick. Thank you!

I will definitely rate the theme; the support here is great! But now I need more help with Grid Row. Here’s the problem:

On the page where I am testing grid rows, I am using an image that measures 1600 x 1200, so it’s a perfect 4:3 ratio. I set the alignment in Image Settings for Center. In Edit Cell, I set the vertical alignment for Top and the padding all around for zero. I created two test rows. For the first test row, I chose the photo size as Portfolio, 495 x 400. For the second test row, I chose Gallery, 845 x 684.

On my desktop screen with a horizontal resolution of 1600, the two test rows look exactly the same. The photos are the same size and the same cropping. There is no space between the photos. There is no space between the photos and the next layout element on the page, which for experimental control purposes is Animated Numbers.

SO, for my actual homepage, I created photos with an original size of 500 x 375, a perfect 4:3 ratio with a width big enough to push the total of the four photos across the screen. I chose the same alignment and padding settings. I chose the photo size as Full Size. In three of the Grid Row cells, I inserted a photo. In the fourth, I inserted Video with a link to the video and a setting for a 4:3 ratio.

But instead of the images extending vertically all the down way to the next element, Animated Numbers, there’s a border at the bottom of each image! I know for sure it’s a border because when I asked for a custom border color in that cell – which I don’t actually want, this was just to test – the color filled in.

I even tried using a test image measuring 500 x 400, which is BIGGER than the Portfolio size, but I STILL get a border at the bottom. This makes no sense! Why would 495 x 400 go flush to the next element but 500 x 400 yield a border?

WHY IS THIS HAPPENING? HELP!!!