CSSトランジションはいくつかの要素でのみ動作します

私は、各アンカーが上に乗ったときに単純なカラーフェードトランジションを行うメニューを持っています。問題は、Chrome v16.0.912.75ではアンカー要素の1つ（この場合は 'twitter'リンクのみ）が実行されており、IE9ではどの要素も移行していないことです（Firefox 8.0.1は正常に動作します）。私はリンクの順序を回転させて、結果のない 'twitter'リンクから 'last'クラスを削除しました。CSSトランジションはいくつかの要素でのみ動作します

これにはあまり意味がありませんので、なぜ機能していないのかわかりません。

#menu_left a{ 
    display:block; 
    width:100px; 
    height:30px; 
    margin:10px auto; 
    font:18px bold; 
    text-decoration:none; 
    border-bottom:1px dotted #e69b8d; 
    -webkit-transition: 0.25s ease-in; 
    -moz-transition: 0.25s ease-in; 
    transition: 0.25s ease-in; 
    } 
#menu_left a.last{border-bottom:none;} 
#menu_left a:hover{ 
    color:#ed9887; 
    transition: 0.25s ease-out; 
    -webkit-transition: 0.25s ease-out; 
    -moz-transition: 0.25s ease-out; 
    }  

<div id="menu_left"> 
    <a href="/">home</a> 
    <a href="/gallery/">gallery</a> 
    <a href="/contact/">contact us</a> 
    <a href="http://www.facebook.com">facebook</a> 
    <a href="http://www.twitter.com" class="last">twitter</a> 
</div>

http://events.bridalflowersexclusive.comで作業を確認できます。あなたの時間を事前に感謝します。

出典

2012-01-10 JBarnes