Виправлений нижній колонтитул у Bootstrap

Я випробовую Bootstrap, і мені було цікаво, як я можу виправити нижній колонтитул внизу, не зникаючи зі сторінки, якщо вміст прокручується?

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

footer {
    position: fixed;
    height: 100px;
    bottom: 0;
    width: 100%;
}

Bootstrap включає цей CSS у розділ Navbar> Розміщення разом із класом fixed-bottom. Просто додайте цей клас до елемента нижнього колонтитула:

<footer class="fixed-bottom">

Документи Bootstrap: https://getbootstrap.com/docs/4.4/utilities/position/#fixed-bottom

Додайте це:

<div class="footer navbar-fixed-bottom">

https://stackoverflow.com/a/21604189

EDIT: клас navbar-fixed-bottomзмінено на fixed-bottomBootstrap v4-alpha.6.

http://v4-alpha.getbootstrap.com/components/navbar/#placement

Додайте це:

<div class="footer fixed-bottom">

Додайте z-index:-9999;до цього методу, інакше він покриє верхню панель, якщо у вас є 1.

Це можна зробити, обернувши вміст сторінки у div із застосованим таким стилем ідентифікатора:

<style>
#wrap {
   min-height: 100%;
   height: auto !important;
   height: 100%;
   margin: 0 auto -60px;
}
</style>

<div id="wrap">
    <!-- Your page content here... -->
</div>

Працював у мене.

Можливо, ви захочете перевірити цей приклад: http://getbootstrap.com/2.3.2/examples/sticky-footer.html