1. 在IE6、7下元素浮动时,并在同一行的元素都要加浮动,才能让在IE6、7下两个不同块的元素在浮动时,其之间不存在空隙。
2. IE6下的双边距BUG问题:在IE6下,块元素浮动且具有横向的margin值时,横向的margin值会被放大成两倍。解决办法:在元素的样式中加入“display:inline;”。
3. 在IE6、7下li的几个像素的间隙问题:在IE6,7下li本身没浮动,但是内容浮动了,于是li的内容下就会多出来几个像素的间隙。其解决办法为:
A. 给li也加浮动,但会出现很多问题,需要添加很多样式,麻烦!
B. 给li加“vertical-align:top;”(推荐);
4. vertical-align表示垂直对齐方式,top表示顶部对齐,middle表示中间对齐,bottom表示底部对齐。注意,在用时一定要在多个对象上都加入代码语句。同时,这个样式对浮动元素是无效的,元素浮动之后,默认是顶部对齐。如果要更改浮动元素的对齐方式,只能通过设置上下边距进行控制。
5. vertical-align还可以用来清除图片下面的空隙,值得一提的是将图片设置为block也可以清除图片下面的空隙,可是,一张图片就只能独占一行显示了,而overflow不存在这个问题。
6. 在IE6下高度小于19px的元素,高度会被当做19px来处理。其解决办法为:
A. 在样式中加入“font-size:0;”,但是这种方法却以牺牲文字的大小为代价,不推荐;
B. 在样式中加入“overflow:hidden;”(推荐);