Can not get footer down to buttom

Im using Angular but i dont think it would matter because this is pure html and css

I have tried to use flexbox on body techniqe and margin-top: auto on the footer
but it did not work.

I can either make it work by giving the Footer a Position: absolute; bottom: 0px
wich does make it stick to the bottom but it will also overlap the content and the navbar if i make the window smaller.

if i do Position: relevant; it will just float in the middle.

So what do i do?


also tried

position: absolute;
bottom: 0px

  display: flex;
  flex-direction: column;
  min-height: 100%; //I also tried min-height:100vh and height 100% and height 100vh


  <div class="container"></div>