Making Bootstrap modal resizable with jQuery UI issue
You actually did everything right! But the default overflow
behaviour of HTML elements is visible
. So if the parent element's content gets overflowed, they break out of the modal and that doesn't look good! So, you need to set the CSS overflow
property to scroll
or hidden
to fix breaking on small size. Try adding:
.modal-content.ui-resizable {
overflow: scroll;
}
This will ensure scrolling on overflow of the element.
Link to JSFiddle: https://jsfiddle.net/p7o2mkg4/1/
This works (css)
#myModal>div{
overflow-y: hidden;
overflow-x: hidden;
}