Boostrap липкий нижний колонтитул - PullRequest
0 голосов
/ 23 июня 2018

У меня есть проект laravel с начальной загрузкой, добавленной как css.Я пытался что-нибудь сделать, чтобы мой липкий нижний колонтитул работал, но как только страница становится длиннее, она остается в нижней части окна при прокрутке вверх.

Мой основной:

<html>
<head>
    <title>Justin van Horssen</title>
    {{-- Bootrstrap 4.1.1 CSS --}}
    <link rel="stylesheet" type="text/css" href="{{ asset('css/style.css') }}">

</head>
<body>
    <header>
        @include('inc.nav')
    </header>
    <main role = "main" class="container">
        @include('inc.messages')
        @yield('content')
    </main>
    @include('inc.scripts')
    <footer class="footer">

    </footer>
</body>

Мой колонтитул CSS:

.footer

    {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 60px;
        line-height: 60px;
        background-color: #003b6f;
    }

1 Ответ

0 голосов
/ 23 июня 2018

Может быть какая-то проблема с html или body css ..

Согласно bootstrap 4 doc css должно быть похоже на ...

 html {
    position: relative;
    min-height: 100%;
  } 

 Body { margin-bottom:60px; } 

Ваш нижний колонтитулс классом все в порядке.

Подробнее о том, как получить липкий нижний колонтитул, можно узнать здесь: https://css -tricks.com / couple-take-sticky-footer /

Спасибо.. надеюсь, это помогает .. ура.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...