CODEWITHSUNDEEP
htmlcss
kurtgn
kurtgn

Reputation: 8710

overflow-y overrides overflow-x

I need a div that has a lot of content and scrolls horizontally. The content (inner divs) has dropdown menus, and when the menus are opened they are supposed to render beyond the outer div's borders.

Like so:

enter image description here

But when i set

overflow-x: scroll;
overflow-y: visible;

my dropdowns aren't opened properly, they are contained within the wrapper div and I need to scroll down vertically to see them.

JSFiddle: https://jsfiddle.net/dk58t1ay/1/

It looks like overflow-x:scroll overrides overflow-y:visible. What can I do about it?

Upvotes: 2

Views: 738

Answers (1)

P.S.
P.S.

Reputation: 16384

You can do it via position: absolute to your .card, but you need to rewrite your styles for other elements.

https://jsfiddle.net/dk58t1ay/6/

Upvotes: 1

Related Questions