display:inline-block 另解

inline-block 是个好东西，谁用都知道。
但兼容 是个问题（仅Opera、Safari、chrome、firefox3.x能完美呈现）

IE下可以通过触发hasLayout 来模拟inline-block

纠正我一直以来的认知错误“ie不支持inline-block” ：
IE5.5就已经支持inline-block 了，可参考display Property 的Remarks部分；

但IE7及以下版本 下给block元素设定inline-block需要使用*display:inline;*zoom:1; 来修正。

麻烦的是firefox2.x
虽然有-moz-inline-block 和-moz-inline-stack 来模拟，但都或多或少有些问题

firefox2.x中使用-moz-inline-stack使用可能遇到的问题：（垂直居中）

可以使用-moz-box-align -moz-box-pack 这2个firefox私类来稍作修正，但始终无法完美模拟。

在一次偶然中，我发现firefox还提供有另一个私有属性display:-moz-box; ，它会根据-moz-box-orient 的值来水平或垂直显示其子元素。
因此给-moz-inline-block 元素的父级定义display:-moz-box; 就可完美模拟inline-block了！（-moz-box-orient默认值为水平显示）
但因为-moz-box的定义，这个方法不适合有其他类型子元素的容器使用。

可点此查看示例

主要样式：

.link-ib,.link-ib span {
	display:inline-block;
	height:40px;
	line-height:40px;
	background:#FFCB06 url(btn.png) no-repeat;
	*display:inline;	/** 修正ie 无法给block元素设定inline-block **/
	*zoom:1;	/** 触发ie中inline元素的hasLayout **/
}
.link-ib {display:-moz-box;} /** for firefox2.x **/
.link-ib span {display:-moz-inline-block;} /** for firefox2.x **/
	.link-ib {
		padding-left:20px;
		color:#654005;
		font-size:16px;
		text-decoration:none;
		background-position:0 0;
	}
	.link-ib span {
		cursor:pointer;	/** 修正IE **/
		padding-right:20px;
		background-position:100% 0;
	}
	.link-ib:hover {
		color:#000;
		background-position:0 -40px;
	}
	.link-ib:hover span {
		background-position:100% -40px;
	}