Bootstrap 4 navbar with icons

<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
    <div class="container-fluid"> <button class="navbar-toggler navbar-toggler-right border-0 p-0" type="button" data-toggle="collapse" data-target="#navbar20">
            <p class="navbar-brand text-white mb-0"> <i class="fa d-inline fa-lg fa-stop-circle"></i> CodeRatings </p>
        </button>
        <div class="collapse navbar-collapse" id="navbar20">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item"> <a class="nav-link" href="#">Home</a> </li>
                <li class="nav-item"> <a class="nav-link" href="#">Contactus</a> </li>
                <li class="nav-item"> <a class="nav-link" href="#">About</a> </li>
            </ul>
            <p class="d-none d-md-block lead mb-0 text-white"> <i class="fa d-inline fa-lg fa-stop-circle"></i> <b> CodeRatings</b> </p>
            <ul class="navbar-nav ml-auto">
                <li class="nav-item mx-1"> <a class="nav-link" href="#"> <i class="fa fa-github fa-fw fa-lg"></i> </a> </li>
                <li class="nav-item mx-1"> <a class="nav-link" href="#"> <i class="fa fa-dropbox fa-fw fa-lg"></i> </a> </li>
                <li class="nav-item mx-1"> <a class="nav-link" href="#"> <i class="fa fa-bitbucket fa-fw fa-lg"></i> </a> </li>
            </ul>
        </div>
    </div>
</nav>

body {
    background-color: #E0F2F1
}

JS

CSS

RUN

add comment