I have been playing around with Flexbox to try and make a sticky footer, but some reason, one of my divs is overlapping the footer? When i drag the window to a larger monitory, the footer is perfect. What am i doing wrong?
Also, i would prefer to use this method instead of other methods, such as the
You need to add a few more rules into your css to get the result you seek. As it is now, it is basically stating that when the space gets reduced, your main content should take more space. Therefore, the footer does not really gets overlapped but rather its size decreases.
Here is something I had done a few months ago... A lot of rules in the css are legacy so be careful but I believe it is close to what you aim to do : http://plnkr.co/edit/o2BAwvg3XV4YjwAwwmYR?p=preview
But really I encourage you to use this to create your flex css rules : http://the-echoplex.net/flexyboxes/