CSSでcharsetの書く位置によってカラム落ちする

ちょっと前にあったトラブルだったのですが、
SafariとChromeでなぜかカラム落ちしてしまう。
IEとFirefoxが正常に表示。。

IEだけズレてるならまだわかるけど
なんでだ!?
いろいろとググってみたのですが、
結局、原因がわからず。

実際横幅とかもちゃんと指定してるし
落ちるわけなくて

で、なんとなくあれこれやってみたら
charsetの前に文字があるといけない
ってのが原因ぽかった。

書き方のサンプル

@charset "utf-8";
/* CSS Document */

はOKで

/* CSS Document */
@charset "utf-8";

はNG

今度からは気をつけます。
皆さんも、可能性としてあるかもしれないので
ここを疑ってみては?

この記事に関連する記事

コメントをどうぞ