I have a chunk of code that animates fontsize changes with the units

set to em. The animation is a bit wacky. The text is supposed to get larger, but it gets smaller then grows larger.

<style>

#test {

font-size:1.2em;

}

</style>

<div id="test" href="http://www.google.com">Test</div>

<script type="text/javascript">

$('#test').mouseover(function() {

$('#test').animate({fontSize:'1.8em'},200);

});

$('#test').mouseout(function() {

$('#test').animate({fontSize:'1.2em'},200);

});

</script>