Compatibility of inline-block attribute_HTML/Xhtml_Web page production

A year ago, there was no article about the inline-block attribute on the Internet. In order to facilitate everyone to better understand this attribute, I summarized and compiled the article "Display: In-depth Understanding of Inline-block" at that time.
Nowadays, there is an increasing demand for the use of the inline-block attribute. Unfortunately, only Firefox3 beta, IE8 beta, Opera, and Safari still support the inline-block attribute (Note: Originally only Opera and Safari supported it), but IE6, IE7 can be simulated by triggering hasLayout. Firefox2 has -moz-inline-box and -moz-inline-stack private attributes (the comparison of these two attributes is quoted from Qin Ge's "Two Examples of the Application of Display:inline-block").
In actual applications, -moz-inline-box will have problems such as alignment between elements. Although Firefox also has a private attribute -moz-box-align to help solve alignment problems, it is still difficult to predict that there will be many problems, and relatively Generally speaking, -moz-inline-stack behaves more like inline-block, which can be tested in Firefox3. However, there is a bug when using -moz-inline-stack. If the outer element of a display:-moz-inline-stack; element is display:inline;, the link contained in it will be unclickable in Firefox. This requires Use position:relative; to solve it.
The final code we simulated is as follows:
display:inline-block; /*Firefox3 beta, IE8 beta, Opera, Safari support, hasLayout that triggers inline elements under IE*/
display:-moz-inline-stack; /* Firefox's private property, You can also use -moz-inline-box */
zoom:1; /*hasLayout is triggered under IE*/
*display:inline; /*Once hasLayout is triggered under IE, setting the block element to inline will make the display:inline effect similar to display:inline-block */
text-indent:-9999px;
*text-indent:0;
font-size:0;
line-height:0; /* If you want to hide text, you can use these four attributes */
/*In addition, to hide the text above, you can also use a more simplified method: line-height: super large value; font-size: 0; */
overflow:hidden; /* Hide overflow content */
vertical-align:middle; /* Vertically center the line, for Opera’s relatively large deviation */
width:? px; /*? For any non-auto value*/
height:? px; /*? For any non-auto value*/