CODEWITHSUNDEEP
csshtmltwitter-bootstraptwitter-bootstrap-3
Jacob Jones
Jacob Jones

Reputation: 501

Bootstrap 3 Space between navbar-brand and navbar ending

I have an issue with Bootstrap 3. I don't know why, but in mobile screen there is space between navbar-brand and navigation bar ending. I guess, it is because of navigation bar glyphicon doesn't fit my navigation bar. How can I solve this issue? I just need to remove that empty space...

Desktop-size version:

desktop-size

Mobile-size version:

mobile-size

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;
}

Upvotes: 0

Views: 1161

Answers (1)

Matthias
Matthias

Reputation: 637

You can remove this space by removing the margin-bottom from the .navbar-toggle:

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

!important is optional, i can't tell you right now if you need this, just test it.

Upvotes: 1

Related Questions