Overlap of borders when using section grids

Ask the community
, ,
1

I’m having trouble with
Inconsistency with lines/borders when using section grids. I have set 1px borders for each individual cell, but the inner lines are causing an overlap making them look bolder than the outer lines. I need all the lines to look the same weight (1px) and be consistent across the site.

Working in
Wix Studio

Site link

What I’m trying to do
I am hoping there is a simple way to make all the lines consistent, or a work around to avoid the overlap of borders.

What I’ve tried so far
I have tried removing the borders on the cells and adding gaps between them, but I need the background colour of the section to be white as I have padding around the section so it is inset from the edges of the page.

Does anyone know a simple fix for this? Or simple CSS that I could try adding.

Thanks

Screenshot 2025-08-11 at 10.37.57
Screenshot 2025-08-11 at 10.37.574318×874 240 KB

2

I think this is less overlapping borders, and more likely borders of 2 adjacent elements touching. In this case, 2 cells side by side with a 1px border (1+1 = 2)

There’s a couple of ways to resolve this:

  • Gaps on the section (although doesn’t fit your use case)
  • Using the lines element, and stretching it to height/width (simulating borders, and not needed in every cell - but likely to make managing across breakpoints more challenging)
  • Using CSS - something like: 
    • .left-border {
  border-left: 1px;
}
    More on using border CSS here
1 Like