Можно использовать онлайн сервисы, например, quirktools.com/screenfly/. Его преимущество в том что работает с localhost и можно задавать кастомные размеры.

Если все дочерние элементы зафлоачены, то происходит схлопывание родительского блока, т.к блочные элементы не видят зафлоаченные. Самый простой и распространенный способ - псевдораспорки:
footer:after {
content: '';
display: table;
clear: both;
}