динамическая настройка высоты div, чтобы нижний колонтитул был внизу, если содержимое не заполняет окно

Мне нужно настроить высоту контейнера div так, чтобы он удерживал нижний колонтитул в нижней части окна onload и onresize, когда содержимое слишком короткое, но не в том случае, если контент выталкивает нижний колонтитул. Я пробовал варианты css min-height: 100%, но он не работает. Мне удалось заставить его работать с этим:

<div class="header></div>
<script>
 var h = window.innerHeight-205;
 document.write('<div id="container" class="container" style="min-height: ' + h + 'px;">');
</script>
  ....content of container....
</div>
<div class="footer"></div>

но при изменении размера окна мой нижний колонтитул заканчивается в середине страницы или на странице. Я пробовал вызывать функцию изменения размера, но, похоже, не получил ее для сброса высоты. Коды, которые я пробовал, были:

function resetHeight () {
var h = window.innerHeight-205;
document.getElementById("container").setAttribute("height",h);
}

а также

function resetHeight () {
var h = window.innerHeight-205;
document.getElementById("container").height = h;
}

Я пытаюсь использовать только javascript и css, а не jquery. Я не слишком хорошо знаком с JS, поэтому, если мне не хватает чего-то, чтобы заставить функцию работать, пожалуйста, дайте мне знать! Я не беспокоюсь о старых браузерах, просто IE9+ и т.д., Он также должен работать на iPads, когда пользователь поворачивает свой экран...

Любая помощь будет оценена!