Problem mit footer

[lascaux]

Ich habe folgendes Problem:

Ich habe auf einer Website einen Inhalt der aus einer Datenbank geladen wird. Die Breite der Div-Box ist festgelegt, die Höhe jedoch nicht, da sich die Höhe je nach anzahl der Einträge ändert. Auf der Seite muss allerdings ein Footer platziert werden, dieser dient zur einfachen 'Navigation'.

Jedoch hängt der Footer stets mitten in meiner Ausgabe aus der Datenbank und nicht am Ende der übergeordneten Div-Box.

<div id="view">
  <div id="content">
    .. ganz viel gedöns ..
  </div>
</div>
<div id="footer">
  <a href=""> ...usw.
</div>

#content {
  width: 750px;
  float: left;
  color: #eee;
  border: 1px solid #b3e1ff;
  background: url(../images/tools/all_bg.png);

#view {
  width: 950px;
  margin: auto;
  margin-top: 40px;
}

#footer {
  height: 30px;
  width: 980px;
  margin: auto;
  padding: 5px 0 0 20px;
  border-top: 1px solid #b3e1ff;
  font-size: 10px;
  color: #b3e1ff;
}

Wenn ich bei #content bzw. #view eine feste Höhe angebe (zB. 300px), dann ist der Footer an einer festen Position.. Allerdings wieder mitten in der Datenbankausgabe.

Mit height: auto; habe ich den selben effekt wie height: 100%;. Gar keinen, der Footer hängt fröhlich in der oberen Div-Box und lacht mich aus..

Habe ich da was übersehen oder bin ich einfach nur zu doof um eine Div-Box unter einer anderen zu positionieren wenn die obere eine variable Höhe hat?

Ich bin ratlos und auf eure Hilfe angewiesen.

lascaux

 

[threadi]

Du floatest #content, daher hat dieses Element keine Höhe und nur die festgelegte Breite. Du musst noch ein clear einfügen um das floating zu beenden und dadurch den #footer direkt darunter darstellen zu können.

 

[lascaux]

Das mit dem clear dachte ich mir bereits schon, habe es aber bis eben nicht getestet (resignation).

Danke für den entscheidenden Tip :)

lascaux