JSFiddle - React, Tailwind, and code Playground

HTML

<div class='wrapper'>
    <div class='cabecalho'></div>
    <div class='conteudo'>
        <p>Se desejar criar conteudo para testar o rodapé</p>
        <button>Aperte Aqui</button>
        <div id='assunto'></div>
    </div>
    <div class='clear'></div>
    <div class='rodape'></div>
</div>

CSS

html,body{
    height:100%;
}
body{
    background:lightgray;
}

.wrapper{
    height:auto;
    width:100%;
    min-height:100%;
    position:relative;
    overflow:hidden;
}
.cabecalho{
    height:50px;
    background:orange;
    width:100%;
}
.conteudo{
    padding-bottom:100px;
}
.clear{
    clear:both;
}

.rodape{
    width:100%;
    position:absolute;
    bottom:0;
    height:40px;
    background:green;
}

JavaScript

$('button').click(function(){
     var parametros = document.createElement("p");
     var t = document.createTextNode("Esse é um conteúdo gerado automaticamente.");
     parametros.appendChild(t);
     document.getElementById("assunto").appendChild(parametros); 
});