У меня есть элемент div в twitter-bootstrap, который будет иметь содержимое, которое будет перетекать вертикально за пределы экрана.

Я хотел бы, чтобы div брал высоту размера окна браузера и позволял остальному контенту прокручиваться вертикально в пределах окна.

У меня есть образец, который не работает @jsFiddle

#content {
    border: 1px solid #000;
    overflow-y:auto;
    height:100%;
}

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span3">Side Bar</div>

        <div class="span9" id="content">
            Content Bar Example Content
        </div>
    </div>
</div>

Я пишу этот вопрос после прочтения, поэтому такие вопросы, какТАК Вопросы

EDIT--

Извините, ребята, я понял, что неправильно понял мой вопрос

То, что я хотел бы, - то, что мой div должен заполнить остальную часть вертикального пространства на экране.

Было бы здорово, если кто-то может предложить адаптивное решение