3-Spalten-Layout und Footer

[Mathias]

Hi!

Ich habe ein Layout mit 3 Spalten. Das klappt soweit. Dadrunter soll ein Footer sein. Das klappt nicht. Der Footer soll unter allen 3 Spalten sein, also muss er ja immer unter dem längsten sein. Leider wird er aber immer unter dem mittleren angezeigt. Wenn der aber nicht der längste ist, siehts scheiße aus. Hier der Quelltext:

<div id="right">rechte Seite</div>
<div id="left">linke Seite</div>
<div id="content">Inhalt - der Footer ist immer so weit unten, wie das ding hier lang ist.</div>
<div id="footer">der Footer</div>

und hier kommt mein css-text

#left {
            float:left;
            width:215px;
            background-color: white;
            height:20px;
       }
       #right {
            float:right;
            width:180px;
            background-color: white;

}

#content {
            margin-left: 215px;
            margin-right:215px;
            background-color: white;
       }
       /* IE CSS Hack by vbdesigns.de */

* html #left {
            margin-right: -3px;
       }

* html #right {
            margin-left: -3px;
       }

* html #content {
            margin: 0 212px 0 212px;
            display:inline-block;
       }

/* Ende IE CSS Hack by vbdesigns.de */

#footer
 {
  clear: both;
  height: 20px;
  background-color: lime;
 }

hoffe es kann mir einer helfen. und ich hoffe man konnte mich verstehen.

vielen dank im voraus,

gruß mathias