I have a problem with the animate() called by a input(unexpected auto shrink after the animation)

I have a problem with the animate() called by a input(unexpected auto shrink after the animation)

The code is like this:
========================================
<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script> 
</head> 
<body> 
  <input id="penis" type="text" value="This penis will shrink=("/> 
  <button>Button</button> 
  <script type="text/javascript"> 
 $("button").click(function(){ 
      $("#penis").animate({width: $("#penis").width()+'px' }); 
 }); 
  </script> 
</body> 
</html>
========================================
Every time the input decreases by 4px after the animation although i have set it animate to its original width  I can't fix this problem, is it a bug in the jquery library or i misused animate()? Can anyone help me plz?