IE7 Margin Bug on jquery slideUp / slideDown

Question

Clicking more info / less info buttons, which slideUp / slideDown content, create a spacing glitch in IE7. Replacing that with show/hide seems to fix it. Does anyone know how to make it work with sliding in IE7?

You can see what I'm talking about and attempt to fix it here: http://jsfiddle.net/C9reK/2/

Thanks in advance!

Update

Not having "position:relative" removes the symptom, and not animating removes the symptom. Unfortunately, neither of these are acceptable options for me, so I'm still looking for an answer that will keep the animation and relative positioning.

Second Update

It turns out that the problem also happened with just show/hide. When the floating stack has an item removed, it repositions/recalculates the stack items, but doesn't account for margin. The jiggle doesn't occur if there are no margins. Obviously, those are necessary.

Answer 1

I don't have IE7 so this might not be the problem but I also ran into problems with slideUp/Down even in webkit and firefox.

My solution was to set the width of the element I was sliding: http://gist.github.com/633771

Maybe this will work?

$(document).ready(function(){
    var $infoContainer = $("#infoContainer");
     $(".moreInfo").click(function(){
         $infoContainer.width($infoContainer.parent().width()).slideDown();
     });
     $(".lessInfo").click(function(){
         $infoContainer.width($infoContainer.parent().width()).slideUp();
     });
 });