ぶれすとつーる

だいたいjavascript

inline-block一回指定しちゃうとhasLayoutを元に戻せないとかいう糞みたいなほんとの話

css 歴史 IE

最近うしろめたいことにちょっと時代錯誤なことしてて、そのせいでhasLayoutの思わぬ挙動に気づいた

<!DOCTYPE html>
<!--[if IE 7 ]><html lang="ja" class="ie7"><![endif]-->
<!--[if (gt IE 7)|!(IE)]><!--><html lang="ja"><!--<![endif]-->
...
<span class="foo">ほげえええ</span>
...

.foo {
    display: inline-block;
}

.ie7 .foo {
    display: inline;
}

こういう状態のとき、inline-blockはhasLayoutのフラグをtrueにするんだけど、ie7のときは上書いてるからhasLayoutはfalseだよねーって思うんだけど実際currentStyle.hasLayoutを参照してみたらtrueだった

ちなみにこういうのだとhasLayoutはfalseだった

.foo {
    display: inline-block;
    /display: inline;
}

1ブロックの中では後で宣言されたものしかよまない(上書きではなく、前が無視される)とかそういうことなんだろうと思う。

調べてたらこんな記事を見つけた On having layout

The display-property differs: while 'inline-block' sets haslayout = true, the flag will not be reset to false later on by overriding the value with 'block' or 'inline' in another rule set.

覆水盆に返らず、世知辛い話ですね。