解决方案
已经找到。代码如下。感谢所有帮助过的人。
解决方案是清除浮点数，下面的代码为我修复了它。
.div#content:after {
content:"";
display:table;
clear:both;
}
再次感谢。
原始问题
我有 2 个 Div，一个是"内容"，我网站的所有内容都在其中。还有一个名为"更新"的div。我希望div"content"调整其高度，以便其中的所有div 都适合。这是一张更容易解释我的问题的图像 Imgur 链接，代表不够高，无法直接发布图像。
这是我的完整源代码（html）（以及内容div和更新div的css。
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/reset.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>MCSocial</title>
<script type="text/javascript" src="src/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="src/jquery.tinycircleslider.js"></script>
</head>
<body>
<div id="container">
<div id="content">
<nav>
<ul class="nav">
<li class="left">MCFish</li>
<li><a href="#">Home</a></li>
<li><a href="http://social.minecraft.uk.to/news/">News</a></li>
<li><a href="#">Members</a></li>
<li><a href="#">Media</a></li>
</ul>
</nav>
<a href="#"><div id="block">
<img src="img/mojang.jpg" height="200px" width="850px">
</div></a>
<a href="#"><div id="block">
<img src="img/minecraft.jpg" height="200px" width="850px">
</div></a>
<div id="updates">
<img src="img/update.png" height="48px" width="140px">
<!--post updates here-->
<h3 class="sub-title">Update 1.5</h3>
<p class="list">Added a new homepage! More simple to navigate! Enjoy!<br>Please send me some feedback <a href="#" class="sub-link">here!</a></p>
<h3 class="sub-title">Update 1.4</h3>
<p class="list">Cleaned up code!</a></p>
<h3 class="sub-title">Update 1.3</h3>
<p class="list">Added new themes! Check them out!</a></p>
<h3 class="sub-title">Update 1.2</h3>
<p class="list">Renamed Site: from MinecraftFishing to MCFish!</a></p>
<h3 class="sub-title">Update 1.0</h3>
<p class="list">Site goes LIVE!</p>
<!--end post updates-->
</div>
<div id="twitter">
<img src="img/twitter.png" height="48px" width="140px"><br><br>
<a class="twitter-timeline" href="https://twitter.com/FluffyRabbitzZ" data-widget-id="544642022154723328">Tweets by @FluffyRabbitzZ</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div id="footer">
<p>©2014. MCSocial. All Rights Reserved.</p>
</div>
</div>
</div>
</body>
</html>
和 CSS;
div#content {
width: 900px;
margin-left: auto;
margin-right: auto;
background-color: #fff;
height: auto;
border-radius: 2px;
min-height: 100%;
position: relative;
}
div#updates {
float: left;
margin-left: 2.6%;
}
感谢您的任何帮助。
您应该清除float。
-
将
overflowCSS 属性（例如:auto）添加到div#content中。 -
现代浏览器的解决方案：
.div#content:after {
content:"";
display:table;
clear:both;
}
您必须清除浮动内容：
<div style="clear:both"></div>
在关闭之前，你div.content.