I audit 100's of webflow sites every month.
Here's the #1 deadly mistake I see on some of the best webflow sites in the world.
Read this 3-minute tutorial & you'll learn:
- What it is
- How to fix it
Thread 🧵
BONUS
This thread is the best I can do via text.
But you'll learn a lot more from watching the 7-minute video version I recorded for you.
Like & comment "horiz" under the 1st tweet (above) & I'll DM it to you
I've seen it on so many great sites
Look at the photo below.
There's an unnecessary horizontal bar at the bottom of the screen. Is it on your site?
It's creating a really poor user experience.
Why?
Horiz scrolling is making your pages "sticky"
Users are trying to scroll.
But when they do, the page won't move.
This is making people leave & it's KILLING your conversion rates.
But it's SO EASY to fix.
If you're using webflow, you probably haven't noticed it because...
It’s a sneaky problem that doesn’t show up when you preview the page.
But click publish and BOOM!
It’s right there.
How do you know you have the scroll issue?
Watch this:
0:000:00
Unnecessary horiz scroll happens when:
📍 Your site has multiple sections with different widths, and
📍 Your VH & VW values are set to fixed widths
But you can fix this in one of 2 ways.
Here they are:
2 things you can do to remove unnecessary horiz scroll from your webfow site:
1. Change the style of the page
2. Change the section width to 100%
Let's dive in:
1. Change the style of the page
Change the Body, VH and VW values of your page to Auto.
This will auto expand the pages to fit the width of the screen.
Just make sure the parent section does not have any style added (like flex or grid)
See below:
2. Swap viewport fixed widths for %'s
Locate the Size option and change VW to 100%
You can also use 100 VW
But VW used with flex styling gives the same scroll issue.
Quick tip
100 VW works well when you have single pages, a pop-up, or an overlay
Basically anything that doesn’t need you to scroll
But when the page has different sections, the scroll issue comes up.
So it’s advisable not to use VW for sections
BONUS
This thread is the best I can do via text.
But you'll learn a lot more from watching the 7-minute video version I recorded for you.
Like & comment "horiz" under the 1st tweet (below) & I'll DM it to you