javascript - JqueryUI and bootstrap interference with dialog display -
i'm having problems getting jqueryui , bootstrap work together. example here https://jsfiddle.net/2hcwxudd/1/ my code: <div id="dialog" title="welcome"> <h1>hello world</h1> </div> $(function () { $("#dialog").dialog({ show: { effect: "fold", duration: 500 }, }); }); you can see on dialog show there small resize event @ end of animation looks horrible. can't seem figure out what's causing or how resolve it, removing bootstrap resolves problem. i've tried noconflict (it's not js css thats causing it), , i've tried using various themes seem have same problem. any appreciated this due box-sizing in bootstraping, have unset box-sizing property like, .ui-dialog,.ui-dialog *{ box-sizing:unset !important; } demo