我是一个完整的 html/css 新手，我正在制作我的第一个网站。我希望它看起来像这样：
http://www.dorishochscheid.nl/
我使用 div 元素来“包含”导航栏和主要内容，如下所示：
<div id = "container">
<nav> ... working navigation bar here ... </nav>
<section id = "content"> ... main content here ... </section>
</div>
这是我的CSS：
body {
background-image: url(images/achtergrond.jpg);
background-repeat: no-repeat;
background-position: bottom center;
margin: 0;
}
#container {
margin: 0 auto 0;
margin-bottom: 200px;
width: 800px;
height: 1000px;
background-color: #de59b2;
opacity:0.85;
/* voor slechte browsers */
filter: alpha(opacity=85);
}
#content {
float: left;
background-color: #de59b2;
margin: 15px 45px;
}
导航栏、内容部分和容器都具有相同的不透明背景颜色。
问题是这样的：我希望容器 div 的高度根据内容部分中放置的内容量增加。但是如果我删除 height = 1000px; 整个容器从视线中消失。导航栏和主要部分的单独彩色框仍然存在。
为什么会这样？？我见过像 height = 100%; 正在使用，但这在这里也不起作用。我可以想象这样一个声明是我正在寻找的，看看我希望容器如何随着内容部分的增长而增长。
为什么会发生这种情况？如何根据容器包含的内容部分中的内容量来放大或缩小容器的大小？
或者这完全是错误的方式来进行这种类型的建设？