Win+IEでは文書の先頭に!DOCTYPE以外のものを書くと、例え
<?xml version="1.0" encoding="utf-8"?>
などであっても、
互換モード
になってしまいます。
!DOCTYPEで
XHTML 1.1や
XHTML 1.0 Strictと宣言しててもです。
互換モードだと何が悪いかって、 カススタイラーにとって一番嫌なのは、 CSSのwidthの範囲に、 padding値 と border-width値 を含んでしまう、ってことだろうかと思います。 他のブラウザでは含まれません。これが標準なのです。 あとデフォルトの font-size が smallだとかw
それへの対処として、いままでは p { width:37em; padding:1em; } * > p { width:35em; } と、IEで使えないセレクタを使ってみたり、 p { width:35em !important; width:37em; padding:1em; } と、IEでは !important としてても 同じ指定ブロックに同じ名前があればそっちを優先する というバグを利用したりしていたかと思います。
でもそれらはIEに働きかけるものではなく、 他のブラウザをどうにかしてるもので、他にも問題点もいくつかありました。 今回はIEだけに働きかけるものとすることができます。
/* compatible */
p {
padding: 1em:
width: 35em;
width: expression('37em');
}
これだと、IE以外では不明なプロパティとして無視されます。 これでWin+IEでもぴったり合うと思います。
ただ、JavaScriptをOffにすると元に戻っちゃうので、 ハッキリ言ってこの用途には使えないです。
また、以下のように書くのが 一番ラクチンで確実でかなりオススメです。
/* compatible */
p {
padding: 1em:
width: 35em;
_width: 37em;
}
underscore hackというワザみたいです。
属性(上で言えばwidth)の前に
_(アンダースコア)をつけるもの。
Mac+IE
は、名前の先頭のアンダースコアを無視する、というのがあって、
これでも属性として認識しちゃうみたいです。げら。
Mac+IE
にはたぶん効かないのですが、
もともとMac+IEは、XHTMLが標準モードなので、効かないほうがいいし(笑)
他のブラウザでも不明な属性として無視され続けることでしょう。
そんなわけでこのワザを推しておきます。
まあ、バグ技ですし、Validではない書き方なことは確かですが。