Can't make dropdown visible with parent div overflow set to hidden

I’m using BS4.6 dropdown with popper.js the click on the three dots should trigger the dropdown menu.

I don’t know really how to aproach this as setting overflow is needed, so I can’t remove that from the cards. Tried with : z-index, position relative. Maybe I need some js?

It is highly unlikely anyone can help you if all you post is an image. Post a live example or at least some code.

My apologies ok here it is

I found as well in case it helps someone a solution:

Last but not less Dropdowns are designed in Bootstrap to be clickeable, hence I’m considering using tooltips instead which work on hover. Thoughts on this are appreciated. maybe there’s something even better than tooltips :smiley:

Why does the card have to have overflow hidden?

Without knowing the actual context it’s hard to give you a good solution. One option might be to move the dropdown out of the card and then position it back so it looks like it is inside the card.

But again how well this will work, or if it will work at all, depends on context. Which I do not really have enough of with just the example you have posted.

Thanks you are correct not enough context. Take a look at the following:
It needs it because the image is not exact here on each card (on desktop screens sizes).
I do realize I could use overflow-y instead of generic overflow. The button is not live on the website yet.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.