}
四、块元素水平居中
元素居中，大家都有碰到过，有时也有不少童鞋会问，怎么我的div元素在IE6下不能居中呢？其实这个Bug并不是什么时候都会发生的，据我查阅相关资料和多次测试，这个Bug只会发生在IE6怪癖模式下，知道问题出在什么地方，那解决起来不难了，最直接的办法就是在你的页面头部记得加上Doctype。有关于DOCTYPE声明可以猛点这里查看。下面我们就针对IE6的怪癖模式来解决这样的Bug。
CSS Code
复制代码
#container{
border: solid 1px #000;
background: #777;
width: 400px;
height: 160px;
margin: 30px 0 0 30px;
}
#element{
background: #95CFEF;
border: solid 1px #36F;
width: 300px;
height: 100px;
margin: 30px auto;
}
产生的效果如图所示 
这主要是由于IE6的quirks模式不识别margin的auto属性值，但还好，解决这个bug并不复杂。只需要在居中元素的父元素中加上“text-align:center”；然后在居中元素中加上“text-align:left”重新让元素文本左对齐
复制代码
#container{
border: solid 1px #000;
background: #777;
width: 400px;
height: 160px;
margin: 30px 0 0 30px;
text-align: center;/*让子元素在IE6的quirks模式实现水平居中*/
}
#element{
background: #95CFEF;
border: solid 1px #36F;
width: 300px;
height: 100px;
margin: 30px auto;
text-align: left;/*重置文本对齐方式，让文本左对齐*/
}
当然元素居中问题是一个比较有意思的课题，如果你对这个感兴趣也可以阅读前面我整理的《CSS制作水平垂直居中对齐》一文，这样你对元素的居中会有更深的了解。
五、列表li的楼梯Bug
li在IE6下呈楼梯状的效果，也可以算是IE6的一个经典Bug了吧。他通常发生在li中放置了一些元素内容（比如说a）而且对其进行浮动，但li本身不浮动，此时在IE下就会有楼梯上了，具体先看下面的代码：
HTML Markup
复制代码
<ul>
<li><a href=”#” _fcksavedurl=””#”” ></a></li>
<li><a href=”#” ></a></li>
<li><a href=”#” ></a></li>
</ul>
CSS Code
复制代码
ul {
list-style: none;
}
ul li a {
display: block;
width: 130px;
height: 30px;
text-align: center;
color: #fff;
float: left;
background: #95CFEF;
border: solid 1px #36F;
margin: 30px 5px;
}
