Как сделать подвал в низу страницы при динамическом рендеринге?
.main{
   height: calc(100% - 50px);
   overflow: auto;
}
50px - высота темного, сырого подвала
Футер поместите в main, уберите цсс, что написан у Вас, и достаточно<body>
    <div class="main">
        <div class="content">
        </div>
        <div class="table">
             Этот див рендерится динамически
        </div>
         <div class="footer">
         </div>
    </div>
</body>.main {
   min-height: 100vh;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}
.content и .table по хорошему тоже лучше обернуть в 1 див, но не обязательно