Double Scrollbar .x-row-inner

[omartan]

Hey guys,

I’ve encountered this problem occasionally and I’m curious to know why is this div/class/margin calculated needed

I’ve recorded a Loom video to highlight the issue. Would love to hear your thoughts.

[tristup]

Hi Omar,

Thanks for reaching out.
I have tried but unfortunately, unable to replicate the issue at our end. If you are still having this issue, please mention the device, browser name and version, and also the operating system you are using, that helps us to replicate the issue at our end.
Please note that the double scrollbar appears only if some of the elements are taller or similar in height to their container. I would suggest you go through the following thread, which may help you.

Mobile scrolling issues

Hi support, I have the mobile scrolling glitch that requires a number of swipes to get the scrolling working. Furthermore when checking the mobile layout on breakpoints I have noticed double scroll bars appearing so clearly something on the layout is not working. Using X theme tested on Android and IOS. Thanks for your help https://malcolmkeeganarchitecture.co.uk/

[Bug] Adding top border to footer adding a double scroll bar

Currently using the latest version of pro/wordpress etc. When adding a 1px top border to a bar in the footer a double scroll bar enters into play. It can be removed with overflow: hidden but want to report it so it can be fixed for anyone who might run into this.

Double Scroll bar products page

[doublescroll] Hi, there is a double scroll on the products page of this site: Any thoughts as to why? Thanks for your help

Thanks

[omartan]

Hi @tristup,

Apologies about that, I’ve added a global CSS to fix the issue.

All you need to do is to disable the global CSS and you’ll be able to see it.

The issue exists in both Safari and Chrome

[Ismael]

Thank you for the info and screenshot.

Did you apply the calc(((20px / 2) + 1px) * -1) value as Design > Margin > Bottom ? This results in a -11px bottom margin , which pushes the row inner outside the row container , causing an overflow and creating a second scrollbar. Removing the bottom and top margin values should fix the issue.

Let us know the result.

Best regards.

[omartan]

Hi,

Nope, but this seems to be a x-row-inner default margin setting?

[tristup]

Hi Omar,

That comes due to the value set to the Gap Height from Row > Layout as shown in the given screenshot. I would suggest you set the value to 0 or try adjusting the value.

Hope it helps.
Thanks