Avoid navbar in Bootstrap from collapsing

Create a simple Bootstrap Navbar without collapsing in cell phones and tablet devices

by Génesis García Morilla

HTML

<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<!-- Simple Bootstrap Navbar without collapsing -->
<header class="navbar navbar-default container-fluid">
    <ul class="nav navbar-nav navbar-left">
        <li><a class="navbar-brand">My App</a></li>
        <li><a>Tasks</a></li>
    </ul>
    <ul class="nav navbar-nav navbar-right">
        <li><a>12/12/99</a></li>
        <li><a href="#">@</a></li>
    </ul>
</header>

CSS

/* Avoid Navbar from collapsing (Bootstrap override) */
.navbar-nav>li, .navbar-nav {
    float: left !important;
}

.navbar-right {
    float: right !important;
}