Unwanted white space and horizontal scroll right

I can’t seem to get rid of the white space/unwanted horizontal scroll bar on the right side of my screen. It only shows up in the published site and not the designer which makes it hard to resolve the problem.

I’ve already watched the webflow university video on this and tried hiding overflow on the sections and even placed all my sections in a divblock with overflow hidden. These recommendations did not work so any help would be very much appreciated!

I have noticed the issue on the “Home” page and the “Solution” page.


Here is my site Read-Only: https://preview.webflow.com/preview/ialign-work?utm_medium=preview_link&utm_source=designer&utm_content=ialign-work&preview=b27acaad9d00e7ef06490ba2e7fac243&workflow=preview

Here is the published site: https://www.ialign.work/

Have you try this?

<style>
body {
    -ms-overflow-style: none;  // IE 10+
    overflow: -moz-scrollbars-none;  // Firefox
}

body::-webkit-scrollbar {
    display: none; // Safari and Chrome
}
</style>```

Thank you for your suggestion. I just tried this which did not fix the issue, unless I am embedding the code in the wrong place.

I went to project settings → Custom code → footer code and pasted the code you provided

Can you please share which device you’re having a problem on and the browser/version. Makes it easier to debug.

Device: Laptop/Desktop monitor/iPhone XR

Chrome Version 93.0.4577.82 (Official Build) (64-bit)
Microsoft Edge Version 94.0.992.47 (Official build) (64-bit)
Firefox Version 93.0 (64-bit)
Safari (Not sure what version)

The overflow is caused by the element with a class of side-pattern-bubble right which is an image. Look at your positioning (right: -11%).

Thank you, that fixed the issue!

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.