CSS3　transition transform

ボックスにマウスを置くと

Chrome限定で、右に200px移動します。

FireFoxだと、文字が浮き上がって見えます。

注：上のグリーンのボーダの周囲に隙間があって、タイトルが小さく表示されている場合は、リロードしてください。スタイルがうまく適用できないことがあるのかもしれません

 やあ、こんにちは
        ドアをあけることが
        
        できたようですね 

CSS

#bgColorDelay {
background-color:#12142B;
-webkit-transition: all 1s ease-in-out;
}
#bgColorDelay:hover{
background-color:#336699;
-webkit-transform: translate(200px,0);

}

.block{
width:200px;
height:200px;
color:#fff;
}

おまけ