Why do animations set the display style to block?
Only block-level elements can have a custom width or height. When you do an animation on an element that animates the height or width (such as show, hide, slideUp, or slideDown), the display CSS property will be set to ‘block’ for the duration of the animation. The display property will be reverted to its original value after the animation completes. (This does not work properly for inline-block elements.) There are two common workarounds: If you want the element to stay inline, but you just want it to animate in or out, you can use the fadeIn or fadeOut animations instead (which only affect the opacity of an element).