Почему footer не отображается в длине?

Несколько возможных причин, по которым footer может не отображаться в длине:

• Смешивание разных единиц измерения. otvet.mail.ru Для корректного отображения рекомендуется привести их к одному-двум типам (например, % и px). otvet.mail.ru
• Неправильное позиционирование. sky.pro Чтобы footer всегда располагался внизу страницы, можно использовать CSS Flexbox. sky.pro Для этого нужно оформить разметку body свойствами display: flex и flex-direction: column, а к элементу main добавить flex: 1, чтобы он занял всё свободное пространство. sky.pro Затем футеру присвоить margin-top: auto, благодаря этому он будет автоматически перемещаться в нижнюю часть страницы. sky.pro
• Перекрытие контентом. sky.pro Чтобы футер не перекрывал основное содержимое, элементу <main> нужно присвоить свойство padding-bottom. sky.pro

Для точной диагностики и решения проблемы рекомендуется обратиться к специалисту.