Jak sprawić, by wysokość div zajmowała całą przestrzeń?

Oto moja reguła css wraz ze znacznikami:

<div style = "height:100%;">
<div style = "width:220px; margin-left: 200px;font-size:16px; height:auto;">
    <div class='navbar-inner'>
        <div class='container'>
        <ul class="nav nav-list">
            <div>   
            <li <?php if($page == 'upload_track'){ echo "class = \"active\""; }?>><a href = "#">Upload a new Track</a></li>
            <li><a href = "#">View all blog post</a></li>
            <li><a href = "#">View all tracks uploaded</a></li>
        </div>
        </ul>
    </div>
    </div>
</div>
<div style = "width:220px; margin-left: 200px;font-size:16px; height:auto;">

od tej pory robię je w stylu inline, aby łatwo było mi je zmienić. odkąd przełączanie edytorów tekstu jest dla mnie kłopotliwe.

Jak sprawiłbym, żeby div zajmował całą dostępną wysokość? jak na samym dole strony. na razie wygląda to tak

chciałem zobaczyć, że czarny div zajmuje całą dostępną wysokość na stronie

questionAnswers(1)

yourAnswerToTheQuestion