css - Bootstrap 3 Space between navbar-brand and navbar ending -



css - Bootstrap 3 Space between navbar-brand and navbar ending -

i have issue bootstrap 3. don't know why, in mobile screen there space between navbar-brand , navigation bar ending. guess, because of navigation bar glyphicon doesn't fit navigation bar. how can solve issue? need remove empty space...

desktop-size version:

mobile-size version:

html:

<header class="top" role="header"> <div class="container"> <a href="../aplikacija/app.html" class="navbar-brand pull-left"> brand </a> <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="glyphicon glyphicon-align-justify"></span> </button> <nav class="navbar-collapse collapse" role="navigation"> <ul class="navbar-nav nav"> <li><a href="#">page 1</a></li> <li><a href="#">page 2</a></li> </ul> </nav> </div> </header>

css:

div.container { background-color: #474747; display: block; width: 80%; height: auto; margin-left: auto; margin-right: auto; padding-left: 0px; } a.navbar-brand { text-shadow: none; background-color: #ccc; color: #474747; margin-left: 0px; } ul.navbar-nav li a{ text-shadow: none; color: #ccc; } ul.navbar-nav li a:hover { background-color: #373737; color: #ccc } button.navbar-toggle { color: #ffffff; } span.glyphicon { color: #009b9b; }

you can remove space removing margin-bottom .navbar-toggle:

button.navbar-toggle { color: #ffffff; margin-bottom: 0px !important; }

!important optional, can't tell right if need this, test it.

css html5 twitter-bootstrap twitter-bootstrap-3

Comments

Popular posts from this blog

formatting - SAS SQL Datepart function returning odd values -

c++ - Apple Mach-O Linker Error(Duplicate Symbols For Architecture armv7) -

php - Yii 2: Unable to find a class into the extension 'yii2-admin' -