Максим

#main высоты нету

a>div.
result: <a href=""><div class='"></div></a>

это версия , но надо доработать : https://codepen.io/MaximLensky/pen/JMbEWg?editors=1100

https://codepen.io/MaximLensky/pen/RxooXP?editors=1100 вроде так ... проверял с маленьким количеством текста и с большим количеством текста

через инспектор нашёл косяк - но не понимаю почему такое решение

@media (max-width:540px){
  #footer {
    padding: 20px 40px;
  }
}

не понимаю почему после увеличения padding скролл пропал но факт в этом

overflow:hidden

у fixed один родитель ... это body
если надо элемент сделать потомком то делается relative для родителя и absolute для потомка
fixed работает так как будто элемент находится вне родителя...

https://github.com/jotform/before-after.js

https://codepen.io/MaximLensky/pen/EbOzBQ?editors=1100 так ?