Compatibility inline-block attribute _ HTML/Xhtml _ webpage Creation

I still couldn't find an article about the inline-block attribute on the Internet a year ago. To help you better understand this attribute, I summarized the article "display: inline-block deep understanding". At present, there are more and more demands for using the inline-block attribute, unfortunately, only Firefox3beta, IE8beta, Opera, and Safari support the inline-block feature. An article about the inline-block feature was not found on the Internet a year ago. In order to help you better understand the feature, at that time, I summarized the article "display: inline-block deep understanding".
Currently, more and more requirements are required to use the inline-block attribute. Unfortunately, only Firefox3 beta, IE8 beta, Opera, and Safari support the inline-block attribute (note: originally only supported by Opera and Safari), but IE6 and IE7 can be simulated by triggering hasLayout, firefox2 has the-moz-inline-box and-moz-inline-stack private attributes (these two attributes are compared from Qin GE's "display: inline-block application two examples").
In practice,-moz-inline-box may have problems with alignment between elements. Although Firefox also has a private attribute-moz-box-align to help solve alignment problems, however, there are still many unpredictable problems, and relatively speaking, the performance of-moz-inline-stack is more like inline-block, which can be tested in firefox3. However, a bug occurs when-moz-inline-stack is used. If a display:-moz-inline-stack is used, the outer element of the element is display: inline; this will make the link contained in Firefox unavailable. The position: relative; should be used to solve this problem.
The simulated code is as follows:
Display: inline-block;/* supported by Firefox3 beta, IE8 beta, Opera, and Safari. hasLayout */
Display:-moz-inline-stack;/* Private Attribute of Firefox, you can also use-moz-inline-box */
Zoom: 1;/* trigger hasLayout under IE */
* Display: inline;/* once hasLayout is triggered in IE, setting the block element to inline will make display: inline effect similar to display: inline-block */
Text-indent:-9999px;
* Text-indent: 0;
Font-size: 0;
Line-height: 0;/* To hide text, use these four attributes */
/* In addition, you can use the simplified method to hide the text above: line-height: Super watermark; font-size: 0 ;*/
Overflow: hidden;/* Hide overflow content */
Vertical-align: middle;/* vertical center in the row, large deviation from Opera */
Width :? Px ;/*? Any non-auto value */
Height :? Px ;/*? Any non-auto value */