Адаптивний футер сторінки приклеєний до низу вікна браузера

41

Невеликий фрагмент коду (фрагментом) css, з допомогою якого можна дуже просто і надійно «прибити», притиснути (приклеїти, sticky) футер сторінки до низу вікна браузера. Один з численних способів, поганий він чи хороший, можна дізнатися лише в порівнянні і при реальному використанні на діючих або тестових проектах.

Адаптивный футер прибитый к низу

Подивіться на реалізацію даного виду приклеєного футера, протестуйте його роботу в різних браузерах на своїх тестових майданчиках.

Спробуйте змінювати розміри вікна браузера, футер буде автоматом підлаштовуватися під вибраний вами розмір.

CSS

#content {
 padding-bottom: 100px;
}
#footer {
 position: absolute;
bottom: 0;
background-color:slategrey;
width:100%;
height: 80px;
color: #ccc;
 text-align: center;
}

#content {
padding-bottom: 100px;
}
#footer {
position: absolute;
bottom: 0;
background-color:slategrey;
width:100%;
height: 80px;
color: #ccc;
text-align: center;
}

З повагою, Андрій.

Удачі! Буду дуже вдячний, якщо поділитеся посиланням на запис у своїх соц. мережах: