BLOG
IE9なのにCSS3が一部効かない例~「transform」とか
IE9は確か“モダンブラウザ”という位置づけのはずなのに、
CSSで“transform”を使った画像回転などを実践してみると、
「アレ?なんで反映されないの?」
という目にあうことがあったりします。
※通常であれば、IE9はIE10への自動アップグレードによってIE8とかよりもソッコー消えるはずですので、
素直にIE10にすれば、本記事のような対応はそもそも不必要になりますので、皆様そういたしましょう。
↑こんなカンジのやつっすね。
しかーし、IE9でなぜか傾いてくれない。どーしてだ??
コレ、要はブラウザのバージョンを誤認識というか、正しく受け止められていないということ。
じゃあどうしようもないじゃないか、
さにあらず、
ベンダープレフィックスをつければ反映される場合があるのです。
ベンダープレフィックスは、「接頭語」ってやつで、
GoogleChromeなら-webkitとか、
FireFoxなら-moz、
とつけるおなじみのやつっすね。
で、IEの場合には、
-ms
とつけてやりましょう。
transform: rotate(-7deg); -ms-transform: rotate(-7deg); /*←コレコレ -webkit-transform: rotate(-7deg); -moz-transform: rotate(-7deg);
コレで反映される場合があるので、
CSSの仕様だとかブラウザの技術的ルールが近未来により進歩するまでは、
とりあえず抑えとして指定してやりましょうや。
※しつこいようですが、IEは常に最新バージョンを使いましょうね♪
タグ: HTML+CSS