CODEWITHSUNDEEP
csstwitter-bootstrap
Shima Mdz
Shima Mdz

Reputation: 195

put some stuff on the very right of a nav-bar(bootstrap)

I'm using a nav-bar from Bootstrap (http://twitter.github.io/bootstrap/components.html#navbar) apart from the links for different tabs which are on the left side of this nav-bar, I want to put my notification icons on the very right of it. How can I do this with CSS? I dont want to use pixels, I rather have it flexible with the size of window and go to the right of this nav-bar.

thanks

Upvotes: 1

Views: 135

Answers (1)

Pascamel
Pascamel

Reputation: 953

Just use two different UL like on the following code :

<div class="navbar navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <div class="nav-collapse collapse">                 
                <ul class="nav">
                    <li><a href="#">THREE</a></li>
                    <li><a href="#">LEFT</a></li>
                    <li><a href="#">ITEMS</a></li>
                </ul>                
                <ul class="nav pull-right">
                    <li><a href="#">RIGHT</a></li>
                    <li><a href="#">ITEMS</a></li>
                </ul>
            </div>
       </div>
    </div>
</div>

Link to a bootply : http://bootply.com/69056

Upvotes: 2

Related Questions