CODEWITHSUNDEEP
drop-down-menutwitter-bootstrapoverflow
Richard Bender
Richard Bender

Reputation: 1134

Bootstrap button dropdown in tab pane causing overflow

I'm using Bootstrap and have a form embedded in tab panes that contains button dropdowns. Sometimes the amount of items in the dropdowns overflows the height of the tab pane. I can always increase the min-height of the tab pane, but this solution is hackish. I have an example jsfiddle here:

http://jsfiddle.net/Sudp7/1/

In it, you can see how the dropdown gets clipped at the bottom of the tab pane. Is there a way to make the dropdown menu overflow the height of its parent container? I have tried playing with the z-index and overflow-y properties to no avail. Any tips would be much appreciated.

Thanks, Richard

Upvotes: 8

Views: 3949

Answers (1)

albertedevigo
albertedevigo

Reputation: 18411

If changing overflow is an option for you, then the right selector is .tab-content

.tab-content {
    overflow: visible;
}

Upvotes: 19

Related Questions