帮忙看下IE6的一个不兼容的问题

这段代码 在IE6 就变形了
其他浏览器都是正常的 如图：
正常情况：
IE6变形：

<div class="grid mainshare">

<div class="tabs_header">

<ul class="cls">

<li class="active"><a href="space.php?uid=5"><span>我的窝窝</span></a></li>

<li><a href="space.php?uid=5&do=friend&view=me"><span>我的关注</span></a></li>

<li><a href="space.php?uid=5&do=fans&view=me"><span>我的粉丝</span></a></li>

<li><a href="space.php?uid=5&do=blog&view=trace"><span>我的喜欢</span></a></li>

<li><a href="space.php?uid=5&do=discuz_posts&type=threads"><span>我的帖子</span></a></li>

        <li><a href="space.php?uid=5&do=thread&view=me"><span>我的话题</span></a></li>

<li><a href="space.php?uid=5&do=album&view=me"><span>我的相册</span></a></li>

<div class="clear"></div>

</ul>

</div>

</div>

.mainshare {

    width: 970px;

}

.grid {

    display: inline;

    float: left;

    margin-left: 6px;

    margin-right: 6px;

}

.tabs_header {

    background-color: #EDF0EB;

    border-bottom: 2px solid #8FC43D;

    margin-bottom: 15px;

    overflow: hidden;

}

.cls:after {

    clear: both;

    content: ".";

    display: block;

    height: 0;

    visibility: hidden;

}

.tabs_header ul {

    color: #588C0E;

    margin: 0 0 0 -2px;

}

.tabs_header li.active {

    background: none repeat scroll 0 0 #8FC43D;

    margin-bottom: 0;

    padding-bottom: 1px;

}

.tabs_header li {

    background: none repeat scroll 0 0 #CAE0B4;

    cursor: pointer;

    display: inline;

    float: left;

    height: 31px;

    line-height: 33px;

    margin: 0 1px 1px 2px;

    text-align: center;

    width: 100px;

}

.tabs_header li.active a {

    color: #FFFFFF;

    font-weight: 600;

}

.tabs_header li a {

    display: block;

    height: 31px;

    line-height: 33px;

    width: 100px;

}

.clear, .s_clear {

    clear: both;

}

请问该怎么做才能兼容IE6呢？谢谢