i am trying
.item { width: 100px; overflow-x: visible; overflow-y: auto; }
But vertical overflow:auto seems to override horizontal's
fiddle: http://jsfiddle.net/xcUTV/
Is there any workaround for this? even with a bit of javascript
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.
The overflow-x and overflow-y properties specifies whether to change the overflow of content just horizontally or vertically (or both): overflow-x specifies what to do with the left/right edges of the content. overflow-y specifies what to do with the top/bottom edges of the content.
The overflow-y property specifies whether to clip the content, add a scroll bar, or display overflow content of a block-level element, when it overflows at the top and bottom edges. Tip: Use the overflow-x property to determine clipping at the left and right edges. Show demo ❯ Default value: visible.
You cannot, that is written in the spec.
Have a look here : https://stackoverflow.com/a/6433475/1343096
Since it is written in the spec, I am 99% sure that it is impossible to do.
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