Установить div, чтобы заполнить остальную часть высоты динамически?

Так. Мой код что-то вроде

<html>
<body>
    <div id="header" style="width:100%;min-height:0;display:block;background-color:#000">
        <img src="header_image.svg" />
    </div>
    <div id="content" style"display:block">
        Some content
    </div>
</body>
</html>

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

Как я могу установить высоту содержимого div для динамического изменения с высотой заголовка?

Я не знаю Javascript или JQuery (я знаю, я знаю - я должен), но в идеале высота содержимого div должна быть примерно такой же, как высота: (высота области просмотра) - (высота заголовка), но я Понятия не имею, как это сделать.

Ответы на вопрос(1)

Ваш ответ на вопрос