hasLayout

IE hasLayout - hasLayout.net - by Zoffix Znet - 這一篇把 hasLayout 解釋的非常清楚

MSIE has quite dated rendering engine (not surprising, as IE is based on Mosaic). In old tabular times, almost any element (except inline content) was a box. There was no way for content to leak from containing table cell, or for table cell to leak out of table...

Many years have passed, and Microsoft began adapting archaic Trident engine to make use of CSS. However, CSS changes the fundamental assumption that old engine was based on - the one that "anything significant" is a rectangle that contains all its content. CSS allows content to overflow out of container. This may happen when content is floated, or if content is too tall/wide to fit inside constrained box.

Where Did It Come From?
Microsoft's "genius" coders decided to fix their ancient engine in a rather bizarre way. And that is where the hasLayout "property" comes from. Every element has hasLayout set to either true or false. If it is set to true - element is a box that is responsible for rendering itself. Therefore, element would be expanded to contain overflowing content, such as floats or very_very_long_words_without_any_breaks. If hasLayout is set to false - element does not render itself, and instead hopes that some ancestor with hasLayout set will do the job for it. This is where the majority of IE bugs come to life.

The following properties/values give an element layout:

* skip list
* position: absolute
* float: left or right
* display: inline-block
* width: any value other than auto
* height: any value other than auto
* zoom: any value other than normal (see description below)
* writing-mode: tb-rl (see description below)

As of IE version 7, few new properties give "layout":

* skip list
* overflow: hidden or scroll or auto
* overflow-x: hidden or scroll or auto
* overflow-y: hidden or scroll or auto
* min-width: any value other than auto
* max-width: any value other than auto
* min-height: any value other than auto
* max-height: any value other than auto

Setting display: inline-block and then reverting it back to the original display property value inside another rule set does not remove layout, this trick can be used to give layout without the use of conditional comments when you cannot use other properties. Here is how this trick would look like:

On having layout — the concept of hasLayout in IE/Win