浮动兼容性问题

先看以下代码

HTML:

<div class="box">
    <div class="left">
        <h1>左侧</h1>
    </div>
    <div class="right">
        <h1>右侧侧</h1>
    </div>
</div>

CSS:

.left{
    float: left
}
.right{
    float: right;
}
h1{
    heigth: 30px;
}
``
这个是我们经常写的左右浮动的布局，每毛病对吧，但是你会在IE6下看到浮动不起来了，h1标签沾满了整行;具体是什么原因大概就是h1是块级元素，所以会占满了一行

解决方案：
    给h1加浮动,这样h1元素的宽度就会自适应

h1{
heigth: 30px;
float: left;
}
“`