<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>测试一些内容</title>
<style>
body{
padding:0;
margin:0;
}
.one{
width:385px;
float:left;
}
.two{
width:385px;
height:52px;
float: left;
}
.three{
float:right;
border:1px solid red;
}
.four{
float: left;
border:1px solid blue
}
.five{
float: right;
}
</style>
</head>
<body>
<div>
<div class="one">
<a href="javascript:;" class="two"> fdfdffddfdfdfdfdfd</a>
</div>
<div class="three">
<div class="four">
dfdfddfddf
</div>
<div class="five">
dfddfddfdfd
</div>
</div>
</div>
</body>
</html>运行这段代码 在谷歌和ie7上显示的效果不同。谷歌下是这样显示的
ie下却是这样显示的这是为什么呢。
应该怎么改 就没有这种bug的显示呢？
浮动元素放到前面
<div class="three">
<div class="five">
dfddfddfdfd
</div>
<div class="four">
dfdfddfddf
</div>
</div>
<div class="one">
<a href="javascript:;" class="two"> fdfdffddfdfdfdfdfd</a>
</div>