Ustaw div, aby dynamicznie wypełnić resztę wysokości?

Więc. Mój kod jest czymś w rodzaju

<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>

Mam nagłówek svg, który ustawiłem tak, aby pasował do szerokości okna i skali wysokości, aby zachować svg. Potem mam resztę strony w innym div. Chciałbym, aby strona nie przewijała się, a ta zawartość wypełniła się, aby pasowała do reszty okna. Problem polega na tym, że ponieważ wysokość nagłówka zmienia się wraz z szerokością okna, nie mogę ustawić div zawartości w pikselach lub procentach ani niczego konkretnego.

Jak mogę ustawić wysokość div zawartości, aby zmieniać dynamicznie wraz z wysokością nagłówka?

Nie znam JavaScript ani JQuery (wiem, wiem - powinienem), ale idealnie byłoby, gdyby wysokość zawartości div była ustawiona na wysokość: (wysokość widoku) - (wysokość nagłówka), ale ja nie mam pojęcia, jak to zrobić.

questionAnswers(1)

yourAnswerToTheQuestion