在使用jQuery UI效果时，如何保持正确的Bootstrap警报大小？

Question

我希望在jQuery UI效果期间保持适当大小的Bootstrap警报，例如＆＃34; shake＆＃34;。

似乎正在发生的事情是，在效果期间，包含警报的div会获得一个小于应有的新高度和宽度样式。一旦效果完成，一切看起来都很正常。

有什么想法吗？

Fiddle me this

$(document).ready(function(){
    $('a').click(function(){
        // or try "bounce", "slide", "drop"...probably others.
        $( ".alert" ).effect( "shake" );
    })
});

Answer 1

这似乎与box-sizing: border-box有关，将其更改为box-sizing: content-box似乎可以解决问题。 DEMO

.alert {
    box-sizing: content-box !important;
}

以下链接中列出了一些其他解决方法......

Bug logged with jQuery UI

Related Question from Stack Overflow