出处链接:http://www.5code.net
解决方法:通过给#box{position:relative}让它脱离文档流.
#box没使用position:relative情况下(IE6)的效果:
以上的效果给了#box{margin-top:-20px} 在IE6下负20的位置被吞噬掉了.
正常情况下:
整体代码:
<!
DOCTYPE HTML
>
< html >
< head >
< title > New Document </ title >
< style type ="text/css" >
* { margin : 0 ; padding : 0 ; }
ul { list-style : none outside none ; }
#test { height : 100px ; margin-top : 55px ; background : orange ; }
#box { height : 50px ; width : 200px ; background : red ; margin-top : -20px ; float : left ; position : relative }
#box2 { height : 50px ; width : 200px ; background : green ; margin-top : 0px ; float : right }
</ style >
</ head >
< body >
< div id ="test" >
< div id ="box" >
box
</ div >
< div id ="box2" >
box2
</ div >
</ div >
</ body >
</ html >
< html >
< head >
< title > New Document </ title >
< style type ="text/css" >
* { margin : 0 ; padding : 0 ; }
ul { list-style : none outside none ; }
#test { height : 100px ; margin-top : 55px ; background : orange ; }
#box { height : 50px ; width : 200px ; background : red ; margin-top : -20px ; float : left ; position : relative }
#box2 { height : 50px ; width : 200px ; background : green ; margin-top : 0px ; float : right }
</ style >
</ head >
< body >
< div id ="test" >
< div id ="box" >
box
</ div >
< div id ="box2" >
box2
</ div >
</ div >
</ body >
</ html >