「互換モード対策」のサンプル

Notice

このページにはサンプル以外の余計なCSSはほぼ使われておりません。

Style

HR 上

width: 500px;

HR 下

width: 600px;

P 共通

border: 1px solid;

border-width: 1px 25px;

padding: 0 25px;

P 500 true

width: 500px;

P 600 false

width: 600px;

P !important

width: 500px !important;

width: 600px;

P underscore hack

width: 500px;

_width: 600px;

P expression

width: 500px;

width: expression('600px');

Sample

P 500 true

P 600 false

P !important

P underscore hack

P expression

Notes

(width: 500px) + (padding: 25px) * 2 + (border: 25px) * 2

ということで、 下のHR線の幅 (600px) と合ってれば、正しい幅です。

P 500 true が 600px 線に合ってるのが 正しい挙動 で、
P 500 true が 500px 線に合ってたり、 P 600 false が 600px 線に合ってるのは 間違った挙動 です。(IE)