有时候，你会发现，在缩小窗口或者拖选内容，又或者拉动滚动条的时候，奇怪的情况发生了：
恭喜你，你终于碰到了所谓的haslayout问题
何为Haslayout：
“Layout”是一个 IE/Win 的私有概念，它决定了一个元素如何显示以及约束其包含的内容、如何与其他元素交互和建立联系、如何响应和传递应用程序事件/用户事件等，这有点类似于一个窗体的概念。
微软的开发者们认为盒状元素(box-type elements)应该具有一个“属性(property)”(这是面向对象编程中的一个概念)，于是他们便使用了 layout , 也就是 hasLayout。
hasLayout 其实既不是一个属性更不是一个行为，而是 IE 这个渲染引擎代代继承一贯拥有的一个渲染概念，在这个概念下渲染的元素将具有一种特性。
实际上这种渲染特性在有些 HTML 元素中与身俱来，而在另外一些元素中也可以通过一些 CSS 属性将其触发为 true ，且一旦触发将不可逆转。
这真是一个伟大的属性，你经常遭遇到的一些浮动问题，滤镜未生效，背景、边框的渲染问题，都是拜他所赐，这个属性还会导致的问题：
Many common IE float bugs.
Boxes themselves treating basic properties differently.
Margin collapsing between a container and its descendants.
Various problems with the construction of lists.
Differences in the positioning of background images.
Differences between browsers when using scripting.
IE 很多常见的浮动 bug 。
元素本身对一些基本属性的异常处理问题。容器和其子孙之间的边距重叠(margin collapsing)问题。使用列表时遇到的诸多问题。背景图像的定位偏差问题。使用脚本时遇到的浏览器之间处理不一致的问题。下列元素默认 hasLayout=true
<table> <td> <body> <img> <hr /> <input>, <select>, <textarea>, <button> <iframe>, <embed>, <object>, <applet> <marquee>haslayout是不能设置的，只能触发，设置下列属性也会导致 hasLayout=true
position: absolute
Refers to its containing block, and that's where some problems begin.
float: left|right
The float model has a lot of quirks due to some aspects of a layout element.
display: inline-block
Sometimes a cure when the element is at inline level and needs layout. Applying layout is probably the only real effect of this property. The “inline-block behaviour” itself can be achieved in IE, but quite independently: IE/Win: inline-block and hasLayout.
any value
This is often an implicit fix, more often the trigger when hasLayout does things wrong.
height: any value
height: 1% is used in the Holly Hack.
zoom: any value (MSDN)
MS proprietary, does not validate. zoom: 1 can be used for debugging.
writing-mode: tb-rl (MSDN)
MS proprietary, does not validate.
inline 元素的特殊情况
width and height trigger hasLayout in IE 5.x and IE 6 in quirks mode only. As of IE6, when the browser is in “standards-compliance mode” inline elements will ignore the width and height properties, and setting the width and height properties will not cause the element to have layout.
ie5.x和 ie 6 quirk 模式中，设置了 width 或者 height 属性的元素 hasLayout=true。ie 6 standards-compliance mode（标准兼容模式）时，设置了 width 或者 height 属性的元素 hasLayout=false
zoom always triggers hasLayout, but it's not supported in IE5.0.
zoom 会导致 hasLayout=true，但 ie 5 不支持该属性。
更详细，更YD的请参阅：http://forest.blogbus.com/logs/2006/04/2340409.html
This entry was written by FoxLing, posted on 2008年08月19日 at 11:44, filed under HTML/CSS/XML and tagged haslayout,IE. Bookmark the permalink. Follow any comments here with the RSS feed for this post. Post a comment or leave a trackback: Trackback URL.