Animowanie elementu div wewnątrz td powoduje nieregularne zachowanie w Chrome

Question

Buduję dość skomplikowany widget interfejsu użytkownika, który ma pewne problemy w Chrome. Udało mi się wyizolować problem i jestem wystawiających go na http://jsfiddle.net/8Kb3B/

mam div wewnątrz td i próbuję przełączyć div z jQuery na .animate(). W Chrome dzieje się tak, że td nie odradza się, gdy div powraca do swojej pierwotnej szerokości. Ponadto, jeśli zwrócisz szczególną uwagę na koniec animacji "ukryj", zobaczysz, że szerokość td miga krótko na szerokość zawartości div, co uważam za dziwne.

To samo dzieje się, gdy jest używany .toggle(delay). Jeśli użyję .toggle() bez opóźnienia, cała sprawa działa zgodnie z przeznaczeniem.

Animacja działa prawidłowo w ofertach Mozilli, a nawet w IE.

Czy brakuje mi tu czegoś naprawdę prostego?

Answer 1

Próbuję z mojej strony może to ci pomóc. Napisz jak to dla webkit przeglądarkach:

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    td { 
    padding-right:2px; 
    } 
    span{ 
    left:5px; 
    position:absolute; 
    } 
    #content { 
    border: 2px solid red; 
    width: 100px; 
    height:20px; 
    display:table; 
    overflow:hidden; 
    position:relative; 
    } 
} 

Sprawdź to dla bardziej http://jsfiddle.net/8Kb3B/3/