Datepicker partially hidden by overflow-y scroll

Question

I am building a bootstrap-grid column inside of which I have a panel.

Inside this panel I have a datepicker and there must a lot of other controls so I would need to be able to scroll down (y-axis only) inside the panel.

Unfortunately the datepicker popup window is partially hidden because of the overflow-z and overflow-x styling which enables the scrolling :

<div style="height: 480px;overflow-y: scroll;overflow-x:hidden;">
...
</div>

Is it possible to overcome this with some CSS trick?

I have found an answer on SO when the element poping out can be placed outside of the div but in my case I'm using a directive from the Angular-strap library so I need to place it inside.

I have set up a plunker to illustrate the issue (you need full-view to see it) : plunker

Answer 1

Well, since no one bothered to answer, I just found the answer today, which was actually very simple.

I just needed to add this in the attributes :

data-container="body"

Plunker here