Why does the sticky navbar doesnt working in Laravel

Issue

I want to do a sticky navbar which the navbar will be static even when scrolling down the page. I tried using the code below, However it doesnt work.

<nav class="navbar navbar-default navbar-sticky-top">
        <div class="container">
            <div class="navbar-header">

                <a class="navbar-brand" href="#">
                    {{ config('app.name', 'Laravel') }}
                </a>
            </div>

                <ul class="nav navbar-nav">
                  <li><a href="/">Login</a></li>
                  <li><a href="/">Register</a></li>
                </ul>


            </div>
        </div>
    </nav>

What should I fix so the sticky navbar will be function well?

Solution

Add this CSS in your header section

.navbar-sticky-top
{
    position: fixed;
    z-index: 999;
    opacity:1;
    width: 100%;
}

Answered By – Md Al imrun Khandakar

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published