Horizontal Scroll on a div

Hello, gorgeous people of the Webflow community!

I seem to have an unexpected horizontal scroll, and I can’t figure out for the dear life of me what’s causing it! Here it is:

It’s a really simple layout with only 3 elements. After pulling my hair out for over an hour, I figured out that, whenever I set the height of the “Div block 5” element to something like 200vh or above, it weirdly throws in a horizontal scroll bar!
The worst part? It only shows up in the browser and not in the designer!

Would anybody please help me with this?
Any help is much appreciated!


Here is my site Read-Only: https://preview.webflow.com/preview/puneeths-dandy-site?utm_medium=preview_link&utm_source=designer&utm_content=puneeths-dandy-site&preview=f8b60aa3e5c1a1b548c1d58b3b47fbdb&pageId=6219ad9e8b14f87a108e3e16&workflow=preview

Live site: https://puneeths-dandy-site.webflow.io/new-gradient

Woah! never seen anything like this before.
Hopefully, @vincent or @webdev might be of help here. :grin:

1 Like

You must have defined the width using 100vw, which, if you want an element to take all the width of the page, should never been used. Use width 100% instead.

Explanation 100VW & Scrollbars

1 Like

Thanks a ton, Vincent! Never knew this problem existed with VW. Gotta use it carefully from now though!
:blush:

1 Like

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