CSS在IE浏览器上使用时经常会出现版面错乱的情况，这是因为IE在解析CSS时与其他浏览器存在差异，下面让我们来探索一下这个问题。

/*代码样例*/
.box {
width: 200px;
height: 200px;
background-color: red;
position: relative;
left: 50%;
margin-left: -100px;
}

在上面的代码中，我们定义了一个宽高都为200px的盒子，并设置了它的背景色为红色，位置为相对定位，左偏移量为50%，并且通过负的左外边距将盒子居中。在大多数浏览器中这段代码会正常工作，但是在IE浏览器中却会出现问题。

问题的原因在于IE浏览器对于计算盒子宽度的方式与其他浏览器不同。在IE中，盒子的实际宽度是包括内边距和边框的宽度，而在其他浏览器中盒子的宽度只包括内容的宽度。

所以，在上面的代码中，当我们将盒子的左偏移量设置为50%时，它是相对于包括内边距和边框在内的盒子宽度进行计算的。而在其他浏览器中，它是相对于内容宽度进行计算的。

因此，在IE中，我们需要通过设置盒子的box-sizing属性来改变计算宽度的方式。将其设置为border-box即可让IE采用与其他浏览器相同的计算方式。

/*修改后的代码*/
.box {
width: 200px;
height: 200px;
background-color: red;
position: relative;
left: 50%;
margin-left: -100px;
box-sizing: border-box;
}

通过设置box-sizing属性，我们就可以避免在IE浏览器中出现版面错乱的问题了。