【前言】
关于IE不支持display:inline-block的问题，这是浏览器兼容的问题。随着所做项目的积累和学习深入后，都会开始接触兼容的问题。
现在大多项目，都不太要求兼容。一般都只要兼容到IE8即可
【案例】
对于这个问题，我先举个例子
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>demo测试</title>
<style type="text/css">
*{margin: 0;padding: 0}
.parent{
width: 400px;
height: 200px;
border: 1px solid red;
margin: auto;
}
.parent div{
background-color: red;
display: inline-block;
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<div class="parent">
<div></div>
<div></div>
<div></div>
</div>
</body>
</html>
测试后会发现，在IE浏览器下解析异常。那么我们来分析一下原因
【详解】
（1）到底什么是inline-block？
设置了inline-block的元素创建了一个行级的块容器，该元素内部即内容被格式化为一个块级元素，同时元素本身被格式化为一个行内元素。直白点就是inline-block的元素既有block元素可以设置高度宽度的特性，同时又具有inline元素默认不换行的特性。
通俗的分开对inline元素和block元素来说就是：inline元素设置了该属性以后，任保持默认的不换行的特性，但其内部表现得就是一个block元素，可以设置高度宽度等。而block元素设置了该属性以后，表现得就是一个行内元素，持有不换行的特性，但实质上任由block的特性，可以设置高度宽度。
（2）IE的inline-block
很多人都说ie6/7不支持inline-block特性，但是在msdn微软开放社区里找到证据，ie从5.5开始就已经对inline-block支持了，只是表象形式上有所偏差。
【方案】
从差异上可以看出ie和其他浏览器的表现形式上不一样，即使是inline-block触发了haslayout还是不具有inline-block不换行的特性，不过想要block支持inline-block元素的特性，我们可以在其基础上添加：
display: inline; zoom:1;
设置display：inline，使block元素变为inline元素，然后设置zoom：1，使其具有布局，就可以设置高度宽度等特性。
【总结】
总结来说就是：ie中的display：inline和zoom：1相当于display：inline-block
.
相关推荐
`display:inline-block` 是 `display` 的一个值，它结合了块级元素（block-level element）和内联元素（inline element）的一些特性，为网页布局提供了更灵活的选择。在本篇文章中，我们将深入探讨 `display:inline-...
要让IE支持`inline-block`效果，有以下两种常见的解决方案： 1. 使用双`display`属性技巧：先设置`display:inline-block`触发layout，然后立即设置`display:inline`。代码示例如下： ```css div { display: ...
IE 6 和 7 不直接支持 `display:inline-block`，但在某些情况下，对内联元素设置 `display:inline-block` 会触发 "layout"，这是一种 IE 特有的行为，使元素获得类似 `display:inline-block` 的效果。然而，对于块级...
然而，IE6和IE7这两个较老的浏览器对`display:inline-block`的支持并不完善，这给开发者带来了不小的困扰。为了解决这个问题，本文将详细介绍两种方法，使得这些旧版IE浏览器也能正确地处理`display:inline-block`。...
早期版本的Firefox（小于3.0）并不支持`display:inline-block`，而是使用私有属性`-moz-inline-box`来实现类似的效果。但由于`-moz-inline-box`存在一些副作用，如可能影响`text-align`的正常工作，因此通常不推荐...
首先，我们需要澄清一个误区：IE6和IE7并非完全不支持display:inline-block。早在IE5.5，微软就已经引入了对这个属性的支持。但与现代浏览器相比，IE5.5至IE7的实现并不完整，存在一些特定的行为和限制。例如，当在...
例如，Firefox 2不支持`inline-block`，但支持Mozilla专有的`-moz-inline-stack`。通过同时设置`display: -moz-inline-stack`和`display: inline-block`，可以确保在Firefox 2和其他支持`inline-block`的浏览器中都...
但很遗憾，最流行的 IE 和 Firefox 却不支持这个属性（在 Firefox3 版本中将会支持 display:inline-block）。不过 Firefox 下却有私有属性 -moz-inline-box 和inline-block 形似，为什么是“形似”而不是“神似”呢...
ie6，ie7的haslayout属性是个让人头疼的问题，想到一个属性display:inline-block;对！inline- block就是干这个事的，让一个元素既不换行又具有block元素的特性
IE6不支持这个属性，但IE8开始支持这个属性。 让IE6内联元素具备inline-block特性 由于inline-block会触发IE的layout，所以IE6中只要设置{display:inline-block;}即可。 让IE6区块元素具备inline-block属性，有两...