On my site I'm having some problems with the overflow-x property.
If I set the body to hidden, and the html I leave to visible, then the site looks great on my Macbook. However, on the iPad, the site is zoomed out all the way like it is not recognizing the overflow-x: hidden markup.
So I tried putting the html to hidden, and it works fine on the iPad. But there's a great big, ugly additional and unecessarly scrollbar always visible on the right when viewed on the laptop.
On my site I'm having some problems with the
overflow-xproperty.If I set the
bodytohidden, and thehtmlI leave tovisible, then the site looks great on my Macbook. However, on the iPad, the site is zoomed out all the way like it is not recognizing theoverflow-x: hiddenmarkup.So I tried putting the
htmlto hidden, and it works fine on the iPad. But there's a great big, ugly additional and unecessarly scrollbar always visible on the right when viewed on the laptop.What can I do to get the best of both worlds?
Have you used the viewport metatag?
I just tried that, and it works fine. Is there a way to "lock" it that way so viewers can't zoom out?
Thanks for the help.
@Diomedes, that's not recommended for accessibility, but it would be
"maximum-scale=1, minimum-scale=1"I see. Any suggestions on how to make the site look good without creating a headache for readers?