我试图让两个div浮动到页面的两侧,文本在它们之间流动.第二个(左对齐)div的顶部应该与第一个(右对齐)div的底部平齐.下面的代码在FF,Chrome,Opera等方面运行良好,但它们在IE中无法正常清除.两个div都出现在文本的顶部.
如果我在文本中将左对齐div移动得足够低,它在IE中工作正常,但这不是一个可持续的解决方案.
我在IE CSS浮动错误上找到了多个页面,但我没有找到任何与此直接对话的内容.
CSS
div {
width: 200px;
margin-top: 10px;
border-style: solid;
border-width: 1px;
position: relative;
}
.wrapper {
width: 600px;
border-color: #FF0000;
}
.right {
float: right;
border-color: #00FF00;
}
.left {
float: left;
clear: both;
border-color: #0000FF;
}
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" href="float.css" />
</head>
<body>
<div class="wrapper">
<div class="right">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Nulla pretium tempor leo. Vivamus mi risus, dapibus ac,
consectetur quis, …