Tom Gerken Tom Gerken - 2 months ago 21
CSS Question

Bootstrap - Popover gets cut off by modal header

I am using a popover inside a modal window in Bootstrap 2.3.1. The problem is that the popover displays UNDER the modal-header div.

You can see an example / fiddle of this problem here: ("Launch Demo Modal", then "Click to toggle popover")
http://jsfiddle.net/cZ6Cr/2/

The relevant code is:

<a class="btn" data-content="And here's some amazing content. It's very engaging. right? And another thing about this is a that it's really long. When I say long I mean really, really long."
rel="popover"
href="#"
data-original-title="A Title">
Click to toggle popover
</a>


*I modified a fiddle created by cvrebert from this thread on GitHub
https://github.com/twbs/bootstrap/issues/5014

Answer

Fixed by using: .modal-body{overflow-y:visible;}

OR

.modal-body{overflow:visible;}

Fiddle: http://jsfiddle.net/cZ6Cr/4/

Comments