两个div左右浮动：页面大小调整时，如何将它们保持在同一水平上？

问题描述：

考虑下面的HTML：两个div左右浮动：页面大小调整时，如何将它们保持在同一水平上？

<!DOCTYPE html> 
<html> 
<body> 
    <div id="container"> 
    <div id="left" style="float: left; background-color: #777; width: 500px;"> 
     Here is some content. Blah blah blah etc. 
     <div style="height: 50px;">Some more content</div> 
     And finally some more. 
    </div> 
    <div id="right" style="float: right; background-color: #aaa; width: 500px;"> 
     Here is some content. Blah blah blah etc. 
     <div style="height: 50px;">Some more content</div> 
     And finally some more. 
    </div> 
    <div style="float: clear;"></div> 
    </div> 
</body> 
</html>

我能做些什么来div#container或其他标记，以防止div#right从div#left下移动时我调整浏览器窗口使得这些窗口宽度越小则1000px？

答

设置一个min-width您的容器：

#container { 
    min-width: 1000px; 
}

答

给#container DIV a min-width: 1000px财产，这样的父母将永远足够宽，以保持两个孩子并排。

答

http://www.w3schools.com/css/default.asp我学会了所有我在这里的CSS，有上定位一节，是非常有帮助的，我建议阅读它，现在你的工作，以及未来的项目。

尝试：

#container { 
    position: relative; 
}

没有这样做。你应该改变你的答案或删除代码。虽然我欣赏这个链接。我会检查出来的。 – DJTripleThreat 2010-11-02 23:41:14

答

div容器不是在你的代码关闭。请检查一次，并应用min-width：1000px;

两个div左右浮动：页面大小调整时，如何将它们保持在同一水平上？

相关推荐