IE Mobie6清除浮动

看来已经有很多中window的毒了，平时操作系统是window，现在还好多人用window mobie，看来已经习惯了window的使用方式。做前端开发，有个IE 6已经够受的了，没想到半路杀出个IE Mobie。期待IE6被埋葬的一天。

      做几个页面，要求即在web上访问，又像wap站点一样，支持大部分手机访问。web页面当然可以做的花花绿绿的，使用css-sprit来制作很炫的效果。想来wap上也能用上一点背景图，先贴上再说。

　　说说问题，有一个bar，左边是导航，右边显示用户登录信息。bar有背景。当然，最常用的方法是使用浮动。基于手机要访问，导航向左浮动，用户信息向右浮动。再使用最常用的清除浮动方式清除下浮动。

.hdnav:after {
display : block ;
clear : both ;
content : "020" ;
height : 0 ;
}
.hdnav { zoom : 1 ; }

再用IETester及其他常用浏览器测试下，良好。再使用Wap站点的DTD，手机上访问应该问题不大，先交差。

      没过多久，问题就出来了。window mobie上有样式问题！再用其他手机(iphone、android、nokia)look，look，都好好的。哎，又是IE！不是在IE6、iE5.5下都测试过的嘛，怎么跑到这个IE Mobie上又有问题！仔细分析下，原来是清除浮动的地方有问题。先换了最原始的清除浮动方法试试，

（也就是添加一个多余的元素，设置样式为clear:both），乖乖，还是不行，怎么会？怎么办？

     想来想去，试来试去，给hdnav添加一个边框，看看这个元素具体在哪。奇迹出现了，hdnav的背景出来了，也就是清除浮动成功了！就这么着吧，只是一个border-top，并把它的border-color设为transparet，效果就出来了。尝试下去掉这个多余的元素，使用原来的.hdnav:after来清除浮动，然后再加上border-top:1px solid transparent。还是不行！乖乖，还是这样来吧。

　　这个border做了个什么事情呢，想来是使IE Mobie haslayout。具体是不是呢，先贴两篇haslayout的博客，忙完手头上的事情再好好研究下这个东东。

IE LasLayOut参考：

IE Haslayout 详解

On having layout

转载于:https://www.cnblogs.com/muguaworld/archive/2010/06/02/1750217.html