Grey border appearing with responsive grid

Design help Layout & Design
1

Hi there I’m trying to make my grid layout responsive.

At the base desktop breakpoint I want the cards to display in one row and at all other breakpoints I would like them in one column.

Currently it works as expected for desktop and mobile, however for mobile landscape and tablet I have these grey borders appearing around the outside of the images.

I’m not sure if this is a grid problem or to do with the way I set the cards up.

Any help would be greatly appreciated!

Screen Shot 2024-08-30 at 9.12.20 AM
Screen Shot 2024-08-30 at 9.12.20 AM766×859 59.9 KB

Here is my site Read-Only: [LINK](Webflow - Grouse Landscapes)
(how to share your site Read-Only link)

2

Hi @Brad_Craig :wave: On tablet breakpoint try to set “transparent” color for background:

image
image1920×1048 153 KB

3

Ah thank you!! That layer was there to try to improve text readability. Should I be applying that styling in a different way to avoid that happening?

4