B-Teck!

お仕事からゲームまで幅広く

CSSハックとWin用Safariをとりあえず使えるようにする奴の紹介

仕事でIE8~IE10とSafariを使う必要があったので

 

/**IE8**/

.selector{
color: #000000¥9;
}

お尻に\9ってつけるのがメジャーらしい。

セレクタにコメントつけるとかいろいろあったけどとりあえず動いてる。

 

/**IE9**/

.selector:not(:target) {
color: #000000¥9;
}

notなんちゃらをつける。

 

/*IE10*/

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
     .selector{
         color: #cccccc;
     }
}

割と見慣れてきた@mediaのやつ。

@mediaはこの辺見たらいいのかな

https://developer.mozilla.org/ja/docs/Web/CSS/@media

 

/*Safari*/

@media screen and (-webkit-min-device-pixel-ratio:0) {
     .selector {
          color: #cccccc;
     }
}

同じくメディアタグ使ってる奴。

Safari用って書いたけど、webkit使ってるChromeとかも引っかかるんだろうなぁ

試してないけど

 

Safariは職場の手元ですぐ確認できる環境にMacが無く、数台を取り合ってる状態。

なのでWinのSafariなんとか使えないかなあ、でも脆弱性怖いよなあとか思ってたらこんなのが

Windows 版 Safari をできるだけセキュアに使う裏技 - Windows 2000 Blog

とりあえずwebkit周りはこれで新しくできるので、ありがたい。

CSSめっちゃ崩れるのも同じだしね()

 

ただ、やっぱり新しいものとは微妙に表示違ったり、魔のヒラギノフォントで結局実機で手直ししなけりゃならなかったりで、嬉しいのに残念な気分。

ブラウザ間とか表示の差とか気にせずにやれたらいいのになぁ、ホント