Span element is clipped of after animation starts

I have a span element thats inside a div. I set the div css property overflow to none, and yet when animation starts the span element is clipped off.

I would like for the span element to not be clipped off and stay the same when animation starts and when done.

Am I missing something, or am I forgetting something? I've been trying to fix thi开发者_运维知识库s for the past couple of hours and yet to no avail. Thanks in advance.

Here's the jfiddle link.

jfiddle link

The span element is the "5", hover over the error div to start animation.

jQuery adds an overflow:hidden when it does animations, so you can't animate the entire container in this case. Try:

http://jsfiddle.net/cwolves/Ka3Pn/19/