CSS3を使用して、最上層を左にスライドさせ、最下層を表示するマウスオーバー効果を作成しようとしています。コードはChromeでは機能しますが、Firefoxでは機能しません...もう一度愚かなことをしましたか？ご協力いただきありがとうございます！
編集：トランジションコードを省略しても、Firefoxの「レイヤー」にカーソルを合わせると何も起こらないので、何か間違ったことをしたに違いありません... :(
コード：
<html>
<div class="layers">
<div class="over">content</div>
<div class="under">content</div>
</div>
</html>
スタイル：
.layers {
position: relative;
width: 200px;
height: 50px;
overflow: hidden;
}
.over {
width: 200px;
height: 50px;
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
}
.under {
width: 200px;
height: 50px;
position: absolute;
top: 0px;
left: 0px;
}
.layers:hover .over {
left: -200px;
}