I'm using jQuery UI's Draggable (https://jqueryui.com/draggable/) to allow the user to drag a div around within a container.

I'm using containment to set an invisible boundary box around the area so the user can't drag the div off the edge.

Here's a codepen of the situation. Unless the browser window is full size the containment area doesn't match up anymore: https://codepen.io/anon/pen/QgaRRe

I want the containment area to resize responsively as the browser window shrinks, any idea how I'd go about doing this?

Thanks