Div skal vokse med indhold

jeg kan ikke få min div til at følge mit indhold.

min htmlkode er:
<div id="container">
    <div id="header"></div>
    <div id="content">
        <div id="navi">
            <ul>
                <li>Menupunkt 1</li>
                <li>Menupunkt 2</li>
                <li>Menupunkt 3</li>
                <li>Menupunkt 4</li>
                <li>Menupunkt 5</li>
                <li>Menupunkt 6</li>
            </ul>
        </div>
        <div id="text"><h1>
            </p>
        </div>
        <div id="footer"></div>
    </div>
</div>

og min css ser ud som følgende:

body {
    background-image:url(images/bg.jpg);
    background-position:top;
    background-repeat:repeat-x;
    margin:0px;
    padding:0px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:12px;
    line-height:1.5em;
    color:#000;
}

#container {
    position:absolute;
    width:800px;
    min-height:500px;
    margin-left:-400px;
    left:50%;
}

    #header {
        position:absolute;
        top:0px;
        width:798px;
        height:168px;
        background-image:url(images/header.jpg);
    }
   
    #content {
        position:relative;
        clear:both;
        top:168px;
        width:800px;
        min-height:400px;
        background-color:#e4e4e4;
        background-image:url(images/content-bg.jpg);
        background-position:top;
        background-repeat:repeat-x;
    }
   
        #navi {
            float:left;
            position:absolute;
            width:150px;
            border-right:1px solid #555555;
            min-height:100px;
            top:20px;
        }
       
        #text {
            float:right;
            position:relative;
            clear:both;
            width:610px;
            min-height:100px;
            right:0px;
            padding:20px;
        }
   
        #footer {
            position:absolute;
            border-top:1px solid #555555;
            width:700px;
            height:30px;
            bottom:0px;
            left:50%;
            margin-left:-370px;
            padding-left:20px;
            padding-right:20px;
            padding-top:8px;
        }


Hvad er det jeg gør forkert?