Remove weird site overflow

Site URL: https://carnation-sailfish-2n5d.squarespace.com/

Site password: Navigation

Hi can anyone tell me why my home page has a weird horizontal overflow and how to stop it?

It's really strange, it's on the right hand side but only for the first half of the homepage, and then sometimes disappears by the time I scroll to the bottom / back up to the top. Is there something in my code that is causing this issue or is it a Squarespace / web glitch?

I don't have a solution but do have a clue. The AddThis appears to be adding the extra space. When I disabled it locally the issue went away.

4 hours ago, creedon said:

I don't have a solution but do have a clue. The AddThis appears to be adding the extra space. When I disabled it locally the issue went away.

Thanks so much for looking!

Very bizarre! I didn’t have any AddThis codes embedded on that page. I have now tried deleting Addthis from the CSS, Site Code Injection and individual page Code Injection but the overflow hasn’t disappeared.

I do have some Google Ads code blocks on the page but I tried removing them on a duplicate page (https://carnation-sailfish-2n5d.squarespace.com/newsroom-no-code-blocks) and it also made no difference.

Can you see any other clues?

Okay I have momentarily deleted my site-wide code injections, css, and removed all code blocks on the duplicate page (https://carnation-sailfish-2n5d.squarespace.com/newsroom-no-code-blocks). Still there is a weird overflow situation on the home and duplicate home page. Feels like I'm going mad!

 @tuanphanI noticed you're online now, do you have any ideas on what's going on or how I can fix it?

2 hours ago, melaniejaane said:

Okay I have momentarily deleted my site-wide code injections, css, and removed all code blocks on the duplicate page (https://carnation-sailfish-2n5d.squarespace.com/newsroom-no-code-blocks). Still there is a weird overflow situation on the home and duplicate home page. Feels like I'm going mad!

 @tuanphanI noticed you're online now, do you have any ideas on what's going on or how I can fix it?

 

Try adding to Design > Custom CSS

body {
    overflow-x: hidden;
}

That worked great thanks

On 7/13/2022 at 12:28 AM, tuanphan said:

Try adding to Design > Custom CSS

body {
    overflow-x: hidden;
}

 

Hey @tuanphan would you please be able to look at this sites overflow again? I thought this code worked but realised it's only working for the initial page load. If change the width of my browser window on my desktop so it gets into tablet / mobile mode, parts of the page stop scaling responsively and sometimes it creates a strange site overflow again. I noticed this first when I opened Chrome inspector in same window. Attached screenshot showing site with header and footer.

Thanks again 🙂

https://www.chrislynchmedia.com/

On 11/24/2022 at 4:14 PM, melaniejaane said:

Hey @tuanphan would you please be able to look at this sites overflow again? I thought this code worked but realised it's only working for the initial page load. If change the width of my browser window on my desktop so it gets into tablet / mobile mode, parts of the page stop scaling responsively and sometimes it creates a strange site overflow again. I noticed this first when I opened Chrome inspector in same window. Attached screenshot showing site with header and footer.

Thanks again 🙂

https://www.chrislynchmedia.com/

Update: Notified Squarespace as when I removed all code issue still occurred. I tried upgrading all the blocks to fluid engine and this managed to fix it. So must be some bug with the old 7.1 Squarespace blocks.

I am still having issues with the google ads not being responsive but may be seperate issue.

On 11/24/2022 at 10:14 AM, melaniejaane said:

Hey @tuanphan would you please be able to look at this sites overflow again? I thought this code worked but realised it's only working for the initial page load. If change the width of my browser window on my desktop so it gets into tablet / mobile mode, parts of the page stop scaling responsively and sometimes it creates a strange site overflow again. I noticed this first when I opened Chrome inspector in same window. Attached screenshot showing site with header and footer.

Thanks again 🙂

https://www.chrislynchmedia.com/

Have you tried checking on real devices yet?

Sometimes resizing in the browser will be different than when testing in real devices.