Menu
I've applied this property to the elements: body and html and still Chrome will let me scroll on the x-axis.
I've tested it in Safari and Firefox and the x-axis scrolling is disabled...
Anyone know what I'm missing?
N.B. Using overflow: hidden works but I'd like people to be able to scroll on the y-axis.
Thanks!
303
It is because you are using position absolute. You cannot use position absolute with overflow hidden, because position absolute moves the targeted element out of context with the document structure.
overflow-x: visible|hidden|scroll|auto|initial|inherit; Property Values: visible: This property does not clip the content. The content may be rendered outside the left and right edges. hidden: It is used to clip the content and no scrolling mechanism is provided.
Viewed in a desktop browser, the black menu bar properly extends only to edge of the window, since the body has overflow-x:hidden . In any mobile browser, whether Android or iOS, the black menu bar displays its full width, which brings whitespace on the right of the page.
You can use
html { overflow-x: hidden; }
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
