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; }
Comments
Post a Comment