奇怪的问题css下面显示不全

遇到了奇怪的问题。

<div class="div1">
    <div class="title">标题</div>
    <div class="text">
        <ul>
            <li>1</li>
            <li>2</li>
        </ul>
    </div>
</div>

当li采用横向显示的时候，li{width:50%;float:left}，问题出来了，在ie下打开，“标题”那里显示不全，或者不显示，残缺的，除非页面可以拖动，把那里移出屏幕再移回来，那里就可以显示，鼠标在页面点一下，又消失了。奇怪之极！

下决心找出问题，一点点的调试，发现问题的所在。原来我只定义了div1的宽度，而text的宽度没定义，按道理定义了div1的宽度，text是包含在div1里面的，可以不用定义了，不会跑出去，但是title那里就是显示不全，这个现象只发生在ie，在firefox和opera没有这个问题。把text的宽度定义一下，就可以了，真奇怪。简洁有时候会导致莫名其妙的问题，兼容性真让人头疼，什么时候统一呢？