CSSエッセンス:HasLayout初探査

このシリーズはZouStrongがまとめて収録しています
ほとんどの低バージョンIEブラウザのスタイル異常は、haslayout(ページ表示異常の根源)に由来し、低バージョンIEでの要素のレイアウトを決定します.

一.何だ?

haslayoutは低バージョンIE(IE 6、IE 7)レンダリングエンジン(Mosaic)の内部構成部分(CSS属性ではない)であり、haslayoutは低バージョンブラウザ独自のメカニズムと言える
haslayoutは、IE 8以降の標準モードでは廃止されています
IEでは、1つの要素が自分自身のコンテンツに対してサイズと組織を計算するか、親要素に依存してサイズと組織コンテンツを計算する.この2つの異なる概念を調整するために、IEレンダリングエンジンはhasLayoutの属性を採用し、属性値はtrueまたはfalseであることができる.

要素のhasLayout属性値がtrueの場合、この要素にはレイアウト(layout)

があると言います.

要素がレイアウト(layout)を持っている場合、それは自身とその子孫要素のサイズと位置決めを担当します(だから、自分と中の内容を維持するためにより多くの代価がかかります)

要素がレイアウトされていない場合、その寸法と位置はlayoutを持つ最近の親要素によって

制御される.
レイアウトを持つ要素は他の人に責任を負わなければならないため、この要素は自分と中の内容を維持するためにより多くの代価を払う必要があり、性能を消費するため、IEの中には必要な要素だけがlayout(つまりhaslayoutがtrueに設定されている)を持っていることを意味し、layoutのない要素はIEの下のBUGの根源である.
デフォルトのレイアウト要素(不完全なリスト)

html,body
table, tr, th, td
img
hr
input, button, file, select, textarea, fieldset
iframe,objects, applets, embed

他の要素(ul、li、div、p、aなど)はデフォルトのレイアウトがなく、BUGの出現を招くことが多いが、解決策はその要素のhaslayoutをトリガしてlayoutを所有させ、BUGがまだ存在するかどうかを確認し、存在する場合は他の解決策を探すことだ.
注意:haslayoutは読み取り専用プロパティです.いったんトリガーされると、逆転できません.

二.haslayoutのトリガー

標準プロパティとは異なり、一部のブラウザのプライベートCSSプロパティとは異なり、layoutはCSS宣言で直接設定できません.つまり「layoutプロパティ」というものはなく、要素自体が自動的にlayoutを持つか、CSSの声明を借りてこっそりlayoutを取得するかのどちらかです.
以下のcssプロパティを設定することで

float： left   right
position：absolute fixed
display：inline-block table table-cell
width：     auto
height:：     auto
zoom： normal     （Microsoft  ——    W3C  ）
writing-mode: tb-rl（Microsoft  ——    W3C  ）

IE 7にはhaslayoutをトリガーする追加の属性もあります

min-height: (   ) 
max-height: (  none     ) 
min-width: (   ) 
max-width: (  none     )
overflow: (  visible     )

明確な幅またはフローティングを持つ要素の大部分はBUGを生成しません.haslayout(spanまたはdisplay:inlineなどのインライン要素)がトリガーされるとwidthまたはheight属性が無視されるため、widthまたはheightを設定して要素にlayoutを持つように命令することはできません.

zoom:1

zoomプロパティは常にhasLayoutをトリガーすることができ、一般的な方法はzoom:1を設定することです.これは、多くの場合、既存のスタイルに影響を与えない条件で要素のhaslayoutを励起することができるからです.