inline-block属性跨浏览器实现

下列 CSS 属性和取值将会让一个元素获得 layout：

• position: absolute
  绝对定位元素的包含区块(containing block)就会经常在这一方面出问题。
• float: left|right
  由于 layout 元素的特性，浮动模型会有很多怪异的表现。
• display: inline-block
  当一个内联级别的元素需要 layout 的时候往往就要用到它，这也可能也是这个 CSS 属性的唯一效果–让某个元素拥有 layout。”inline-block行为”在IE中是可以实现的，但是非常与众不同： IE/Win: inline-block and hasLayout 。
• width: 除 “auto” 外的任意值
  当遇到layout错误的展现效果是，一般都会尝试设定高度来修复
• height: 除 “auto” 外的任意值
  height: 1% 就在 Holly Hack 中用到。
• zoom: 除 “normal” 外的任意值
  IE专有属性。不过 zoom: 1 可以临时用做调试。
• writing-mode: tb-rl
  MS专有属性。
• overflow: hidden|scroll|auto
  在 IE7 中，overflow 也变成了一个 layout 触发器，这个属性在之前版本 IE 中没有触发 layout 的功能，除非这个元素被其他情况触发添加到了一个盒子中；
• overflow-x|-y: hidden|scroll|auto
  overflow-x 和 overflow-y 是 CSS3 盒模型中的属性，尚未得到浏览器的广泛支持。他们在之前版本IE中没有触发 layout 的功能。
• 另外 IE7 的荧幕上又新添了几个 haslayout 的演员，如果只从 hasLayout 这个方面考虑，min/max 和 width/height 的表现类似，position 的 fixed 和 absolute 也是一模一样。
• position: fixed
• min-width: 任意值
  就算设为0也可以让该元素获得 layout。
• max-width: 除 “none” 之外的任意值
• min-height: 任意值
  即使设为0也可以让该元素的 haslayout=true
• max-height: 除 “none” 之外的任意值

有关内联元素：

对于内联元素(可以是默认即为内联的比如 span 元素，也可以是 display: inline 的元素)

• width 和 height 只在 IE5.x 下和 IE6 或更新版本的 quirks 模式下触发 hasLayout 。而对于 IE6，如果浏览器运行于标准兼容模式下，内联元素会忽略 width 或 height 属性，所以设置 width 或 height 不能在此种情况下令该元素具有 layout。
• zoom 总是可以触发 hasLayout，但是在 IE5.0 中不支持。

具 有”layout” 的元素如果同时也 display: inline ，那么它的行为就和标准中所说的 inline-block 很类似了：在段落中和普通文字一样在水平方向和连续排列，受 vertical-align 影响，并且大小可以根据内容自适应调整。这也可以解释为什么单单在 IE/Win 中内联元素可以包含块级元素而少出问题，因为在别的浏览器中 display: inline 就是内联，不像 IE/Win 一旦内联元素拥有 layout 还会变成 inline-block。

.inline{*display:inline;}//ie6 and ie7
.layout{zoom:1;display:inline-block;}