Horizontal scroll bar appearing

My site seems to be too wide (there’s a gap down the right hand side of the page and the horizontal scroll bar appears) but I’m not sure what’s causing it.

Thanks for your help.


Here is my site Read-Only: https://preview.webflow.com/preview/sk-new-c3049b?utm_medium=preview_link&utm_source=designer&utm_content=sk-new-c3049b&preview=cfe0a00f1da18e19d4cff4a2d3440eb9&mode=preview

Maybe one of your elements is flex and aligned to the left?

I went on there but could not see any problems.

Did you already fix the problem?

It’s still there, I’m afraid: https://www.loom.com/share/ed6f9c7c23224b9487b4fe2aecd3d7d9

I see, sorry i forgot to scroll to the right.

It is your element BG

It’s natural width is wider than the screen, so you should try placing it in a div with a max width of 100VW that should solve your problem

or set the width of the container that it is in, 100VW

So I have had a play,
the container that it sits in get rid of all its classes. give it a new class.
set to flexbox, align and justify center.

that fixed it for me

Hi Tom, I fixed up the width of the container and that did it - thanks!

Awesome, if you could just check the box to show the post has been solved. that will help with the filtering of your question.

1 Like