Bootstrap底部可滚动导航栏

Question

I have a simple question which i searched the web and cannot find the answer. I created a bootstrap responsive bottom navbar. When I list many things using the <li> tag, after the space is over in the first line in the navbar, it creates another line. Instead, how to make a bottom fixed navbar which is only one like and can be scrolled within the line. Sorry for my bad english. Thanks

Answer 1

Supposing your navbar has HTML like this:

<ul class="nav navbar-nav">
    <li class="nav-item">Link</li>
    <li class="nav-item">Link</li>
    <li class="nav-item">Link</li>
</ul>

The following CSS rule will make each list item inline:

.navbar-nav .nav-item {
    display: inline-block;
}