无论屏幕大小如何，我都试图将两个div并排浮动。在IE 7中，如果我调整窗口的大小，那么一个div会低于另一个。我认为它是因为div2包含一个表格，一旦窗口边缘击中表格，它就会下降到div1之下。
我目前在IE9和Firefox中工作但它需要在IE6 + 7中工作。我试过这个解决方案CSS floats - how do I keep them on one line?但它似乎没有帮助。我认为这可能是由于这些div中的内容。如何复制它？
码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<style>
#wrapper {
min-width:510px;
width: auto !important;
width: 510px;
border: 1px solid red; }
#div1 {
float:left;
color:blue;
width:500px;
border: 1px dashed purple;
height: 400px;}
#div2 {
margin-left:505px;
border:1px dashed purple;}
#div2 table{border: 1px dotted green;}
</style>
</head>
<body>
<div id="wrapper">
<div id="div1" >
Sometimes I contain a table and sometimes I contain an object. Bother of which displays a chart
</div>
<div id="div2">
<table>
<tr>
<td> I am normally a report
asdfasdfads
dsafasdfasdfasdfasdfadsfasdfasdadfadsfadfsdfasdfsdffGreat Thanks, today has been quiet hot but somehow a bit cooler than this time last year.
</td>
<td></td>
</tr>
</table>
</div>
</div>
</body>
</html>
一个现实的例子可以在这里找到http://jsbin.com/awijew/11
删除边距左：505px;在div2上
给出宽度为“％”
喜欢
#div1 {
float:left;
color:blue;
width:48%;
border: 1px dashed purple;
height: 400px;
}
#div2 {
width:48%;
border:1px dashed purple;
float:left;
}
#wrapper{
display: flex;
justify-content: space-between;
border: 2px dotted red;
padding: 20px;
}
#wrapper div{
width: 48%;
border: 2px dotted purple;
} <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JS Bin</title>
</head>
<body>
<div id="wrapper">
<div id="div1" >
Sometimes I contain a table and sometimes I contain an object. Bother of
which displays a chart
</div>
<div id="div2">
<table>
<tr>
<td> I am normally a report
asdfasdfads
dsafasdfasdfasdfasdfadsfasdfasdadfadsfadfsdfasdfsdffGreat Thanks,
today has been quiet hot but somehow a bit cooler than this time last
year.
</td>
<td></td>
</tr>
</table>
</div>
</div>
</body>
</html>