I have a WordPress site here:

and at some unknown point a month or so ago double vertical scrollbars appeared on the site.

I was able to fix this (remove the second vertical scrollbar) by adding this code to the Additional CSS section for the whole site:

html, body {
        max-width: 100%;        
    overflow-y: visible;
}

However, I later noticed that the site can be scrolled very slightly horizontally on my iPhone and iPad (not on desktop browsers though).

The solution appeared to be adding:

overflow-x: hidden

to the same Additional CSS section.

However, it appears that if you’re using ‘visible’ for one of the overflow values, then both have to be ‘visible’ … you can’t have one set to ‘visible’ and one set to ‘hidden’.

This was the closest I got to an explanation of why this is the case:

https://teamtreehouse.com/community/overflow-y-not-visible-when-overflow-x-is-set-to-scroll

At the moment I’ve prioritised not having the double vertical scrollbars as this is much more annoying than the slight horizontal scrolling … but I’d ideally like to fix both problems.

Can anyone guide me on the steps I can take to fix both of these issues?

Thanks so much for your help!

David

Many thanks for your reply.

Ah that’s interesting …

So if I remove the ‘overflow-y: visible’ code then you’re right, nothing actually changes – the double scrollbar still doesn’t appear, although the horizontal scrolling is still there.

But if I then add:

overflow-x: hidden;

Then the double vertical scrollbar appears … but then the horizontal scrolling problem disappears! …

I’ve now just left the ‘overflow-x: hidden’ code active on this staging site so you can see the problem:

https://horizonimaging.flywheelstaging.com/

At my end I now have double vertical scrollbars, but no horizontal scrolling on iOS.

Thanks for your help!

David

Thanks again for your quick reply ??

So are you saying I need to implement the ‘overflow-x: hidden’ code differently? Are you able to write out how the code should look for me?

Many thanks again! ??

David

I have no problems with the scroll bar on my site. I am therefore a little surprised.

I will continue to have a poke around to make sure neither problem occur on either my laptop or iOS devices but it’s looking hopeful.

Thank you so much!!

David

I’m not a coder, but if I’ve learned anything from modifying and tweaking this website (which a company built for me), it’s that sometimes one fix breaks something else, which you may not immediately notice! ??

Thanks again!

David ??

David