Как правильно выстроить layout?

Я решил перейти на flexbox. Начал все переводить на flex, весь layout.
В итоге возникли две проблемы:
- не могу прибить футер книзу страницы, когда контента мало.
- сайт должен отображаться как на десктопе при масштабе 350x350.

На скрине видно что когда контента мало футер не прибит.
Здесь при масштабе 350x350 тоже видно что футер не прибит.

Еще такая проблема возникает, что теги html, body и div.wrapper не занимают все область окна по ширине и по высоте.

Примерно вот так должно это выглядеть когда контента мало, то есть wrapper занимает всю высоту и ширину, а футер в самом низу joxi.ru/DrlaJBWCVyezym

Сайт profitway.net, страница новости

Короче я как-то не правильно выстраиваю свой layout.
Помогите решить данные задачи:
- прибить футер книзу страницы, когда контента мало и чтобы футер не был фиксированным по высоте.
- сайт должен отображаться как на десктопе при масштабе 350x350.
- все должно быть на flexbox.

Очень жду помощи, мучаюсь около недели.