jQuery slide is jumpy

I found what works consistently is setting an invisible 1px border:

border: 1px solid transparent;

No need to fix the width or height or anything else and the animation doesn't jump. Hooray!

The solution is that sliding div must have the width set in pixels. Do not use 'auto' nor '%'. And you will have great result! The problem is in inline elements thats are in a sliding div.

but if they have width in px the height will be identical. Try it.

I've ran into this problem today. I did notice however that disabling all CSS fixed the problem. Also I knew it worked fine before so it must have been recent changes that caused the issue.

It turned out I used transitions in CSS to ease in and out of hovers.

Once these transitions were removed from the elements I was adding everything was fine.

So if you have the same issue, just add these lines to the elements you're adding:

-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
-ms-transition: none;
transition: none;

(I might have abused transitions a bit by not just adding them to the elements I want to have transitions for, but using them for the entire website.)