Two Scroll Bars Showing up Along Side?

Support
#1

Hi Guys,

I just noticed something that I don’t think I’ve ever seen before: I currently have two scroll bars showing up along the right-hand side of a site I’m working on. I’ve tried it in a couple different browsers and both logged in and not, and they don’t seem to go away. Do you have any idea why this is happening?

The website is lionsroar.org.

I’m using Pro 1.1.1 and WordPress 4.8.1.

Thanks so much for your time! I appreciate it!

Regards,

Byron Leavitt

#2

Hey @ByronL,

Thanks for writing in! In further investigation I found that the 6em height in your last footer bar is creating extra scroll bar.

Just increase height up-to 8em to resolve double scroll bar issue. Edit your footer and adjust height.

Let me know how it goes.

Regards

#3

That did the trick! Thanks so much. You guys are incredible.

#4

You’re welcome! :slight_smile:

#5

Hello! I’m having the same problem, but I don’t have a footer and I can’t figure out how to fix the overflow issue. It could be because of a fullscreen Rev Slider above my header but I’ve tried to set the overflow to hidden or initial to no avail so far.

Site is http://eastendcemeteryrva.com/

Password to view is “eecwp”.

I’m on X 5.2.5 and WP 4.9.1

Thanks so much!

#6

Howdy @eecwp,

Thanks for writing in! This is due to the negative margins you have set on the last section of your page titled “East End Cemetery.” You have a setting on it of margin: -2.5em, which is creating a negative margin pull in all directions. You would actually see a horizontaly scrollbar on your website as well with this, but we have a base style that hides overflow on the X-axis for the website. To get rid of the double scrollbar, removing the negative margin on the bottom (like so: margin: -2.5em -2.5em 0) should get you there. Basically, you’re just pulling your last element beyond the bounds of the body container, which is creating this effect. Always make sure the final eleemnt on your page doesn’t have any negative margins on the bottom and you should be fine.

Cheers!

1 Like
Scrolling Issue on Mobile + Two Scrollbars
#7

Thanks! I must have bumped that to negative in Cornerstone. I appreciate your help. Resolved now.

#8

Glad we were able to help :slight_smile:

1 Like
#9

Good day,

I have a similar issue on one of my sites.

There is always a scroll bar present even when the content of the page is much shorter than the browser window height.

And when scrolling all the way to the bottom of a longer page a secondary scroll bar appears.

I’m not sure if this is also an issue in the footer of this site.

The site is running WordPress version 4.9.1 and X-Pro version 1.2.7.

Kind regards,

#10

Hey @Glasseye,

Please give us the URL of the page you’re having this issue with.

Thanks.

#11

The site is https://drizakurology.co.za

#12

Hi There,

Please add to X | Theme Options | CSS

body {

    overflow-x: initial;
}

Hope it helps!

#13

Many thanks, the code has resolved the scrollbar issue.

But can you clarify what the cause of the problem was? I do not have this problem on any of our other client sites using X-Pro.

#14

HI There,

This happens when the content is wider than the screen, it is probably being cause by a setting on your footer builder, I could not figure out what is the cause just by analazying the page.

But the provided code will fix the weird behavior and wont have any negative impact on your website.

Hope it helps

#15

Thanks for clarifying. I will investigate and see if I can find the culprit.

Best regards,

#16

Sure, please let us know. Thanks!

#17

Hello,
I have the same problem, except that double scrolls do not appear on all computers, mainly on PC with explorer …

www.33elmusical.es

#18

Hi @artia,

I checked and I don’t see double scroll bars on my computer (windows 10), then I tried it too on 7 and 8 and there is none too. Perhaps you already fixed it?

Thanks!

#19

Yes!!!
I wrote

overflow-x: initial;

and its fine!
Thanks!

#20

Glad it’s works now and thanks for sharing :wink: