Установите высоту div на 100% родительского

Я хочу следующий макет для моей веб-страницы:

|         header       |
| navigation | details |
|            |         |

Где панель навигации (контент динамически генерируется) содержит сотни элементов. Я хочу, чтобы на панели навигации была создана вертикальная полоса прокрутки, чтобы на панели была высота окна минус высота заголовка.

Моя страница примерно имеет следующую структуру:

Со следующим CSS:

#navigation {
    float: left;
    width: 400px;
    height: 100%;
    overflow: auto;
}

#details {
    margin-left: 420px;
}

В основном это работает, за исключением того, что панель навигации получает 100% высоты окна, а не 100% высоты окна минус высота заголовка. Я'Я бы не стал явно устанавливать высоту заголовка, если я могу этого избежать. Я совершенно новичок в веб-разработке, поэтому я неНе возражаю читать. Что мне нужно сделать, чтобы получить макет, который я хочу?