WPIntell

Source evidence

Full screen horizontal scrollbar issues

Ollie Menu Designer · support · 2025-10-09T01:00:00+00:00

mixedsentiment
mediumseverity
0.84relevance
4replies
Evidence linked to opportunitycommercial context

Proof Health

Open evidence

Commercial opportunities need traceable source links before they are treated as build-worthy.

3 / 18 rows with source links

16.7% of this page's analysis has direct source links.

0 build-decision rows missing links

0 rows here require auditable proof before promotion.

15 rows with no attached evidence

0 rows have source counts but still need direct links.

Conversation

support
aintnobody resolved
I love this plugin, it helps a lot with solving the mega menu dilemma in FSE. However, the full width option for the dropdown runs into the old CSS issue with browser scrollbars and causes horizontal scrolling. My temporary fix was to use position: fixed; on the dropdowns, which has its own issues, but it did the job. I’ve tried the body container trick to fix it, but then the dropdown’s left position is slightly wrong (not fully aligned to the left) and the horizontal scroll issue remains. I’ve ended up making the header into a container, which meant the dropdowns are not truly full width now, but close enough and they look great. This topic was modified 7 months, 3 weeks ago by aintnobody . Reason: Additional information with a workaround Hey @aintnobody ,thanks for the heads up! I’ll take a look at this and get a fix into the next release. Hey there, can you try adding this CSS to see if it helps? If so, I can add it to the plugin: body:has(.wp-block-ollie-mega-menu__menu-container.menu-width-full) { overflow-x: hidden; } Hi Mike, thanks for that. I’ve tried it and it does stop the horizontal scroll, but the calculation for left positioning is off by ~1.5px so there’s a tiny gap between the mega menu and the left side of the screen. This gap appears on big and small screens on refresh, but when going from big to small screen (e.g. external screen to laptop screen without refresh), the gap is gone and it looks as expected. This part might be caused by something else in my theme or a setting on my Mac. For context, this is on local, so I don’t have a link to share, and the site is built on top of the Frost theme. I’m happy with my solution of making the <header> a container, so don’t want to be a bother. This plugin has improve FSE so much. Ok cool. I’ll keep looking on my end to see if we can fix that 1.5px gap. Thanks for your quick feedback!

Comments

4 shown
Mike McAlister 2025-10-09T19:29:00+00:00

Hey @aintnobody ,thanks for the heads up! I’ll take a look at this and get a fix into the next release.

Mike McAlister 2025-10-12T19:31:00+00:00

Hey there, can you try adding this CSS to see if it helps? If so, I can add it to the plugin: body:has(.wp-block-ollie-mega-menu__menu-container.menu-width-full) { overflow-x: hidden; }

aintnobody 2025-10-13T10:55:00+00:00

Hi Mike, thanks for that. I’ve tried it and it does stop the horizontal scroll, but the calculation for left positioning is off by ~1.5px so there’s a tiny gap between the mega menu and the left side of the screen. This gap appears on big and small screens on refresh, but when going from big to small screen (e.g. external screen to laptop screen without refresh), the gap is gone and it looks as expected. This part might be caused by something else in my theme or a setting on my Mac. For context, this is on local, so I don’t have a link to share, and the site is built on top of the Frost theme. I’m happy with my solution of making the <header> a container, so don’t want to be a bother. This plugin has improve FSE so much.

Mike McAlister 2025-10-13T15:54:00+00:00

Ok cool. I’ll keep looking on my end to see if we can fix that 1.5px gap. Thanks for your quick feedback!