Thin black lines appearing randomly on page

Site URL: https://magnolia-tulip-bkar.squarespace.com/

Hi brains trust!

I'm building a website for a client, and occasionally, thin horizontal lines will appear across the page. They come and go when I resize the browser.

I know this has something to do with my custom html implemented illustrations (the blue botanical ones) possibly mucking something up but I can't figure out a workaround. See screenshots from client.

Could anyone help me find a quick solution to this finicky problem?

https://magnolia-tulip-bkar.squarespace.com/
pw: demo

Thanking you in advance.

I have the same issue! Anyone found a solution yet? Pulling my hair our 😞

3 hours ago, luxurylloyd said:

I have the same issue! Anyone found a solution yet? Pulling my hair our 😞

If you share link to your site, we can check easier.

I'm also experiencing the same issue. It's more prominent on iPad, but does occasionally show on the desktop and mobile. If I resize the browser, or scroll up and down, it disappears. This happens on both Chrome and Safari.

My website is williamshandbaked.co.uk. It tends to only affect the banner image on the homepage (which uses an index collection). Other pages don't seem to be affected.

Can anyone help? I'm on SS version 7.0

Thanks!

Add to Home > Design > Custom CSS

section#introduction {
    background-color: white;
}

That's worked a treat, thank you Tuanphan!

This code didn't worked out for me... but managed to resolve the issue with:

.Index-page--has-image {
    background-color: white !important; 
}