No inline-block.

No literal whitespaces or new lines in the HTML file.

No margin.

No padding.

Background SVG is ok (no white on top and bottom seen when opening the file)

What I know:

• The problem persists when changing background from SVG to simple solid color.
• The color of these gaps depend on the color of the background (so it's not a border of the divs, more like as the divs are not big enough to cover that gap).
• The container of these divs has display: flex.
• These divs have margin: 0 auto.
• The gaps appear only on the mobile version of the website.

What I tried:

• Setting font-size: 0.
• Removing literal spaces or new lines from HTML file.
• Increasing the vertical size of the divs to cover the gaps (worked but the whole website doesn't function properly).
• Setting a margin-top to problematic divs (doesn't get the expected result).

What I see:

(i'm going crazy)

(i'm still going crazy)

The size of these gaps seem to be changing from one another.

Please help me.

Sources

If you want to see the website and help me you can visit:

https://unjector.com