CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
susi87
susi87

Reputation: 133

Bootstrap NavBar with center aligned items

On the left side is my brandname. I try to center the text and the icons in the navbar. But it is allwys to the left of the brandname.

<div class="navbar navbar-fixed-top hidden-sm hidden-xs">
  <div class="navbar-inner">
    <div style="" class="container-fluid navi">
        <div class="navbar-header">
          <p class="navbar-brand brand">Lapsy</p>
        </div>
        <div>
          <ul class="nav navbar-nav navbar-center">
            <li>Follow us</li> 
            <li><img src="img/f.png" alt="Facebook Fanpage" class="img-responsive">  </li>
            <li><img src="img/t.png" alt="Twitter Fanpage" class="img-responsive">  </li>
          </ul>
        </div>
      </div>
  </div>
</div>

Upvotes: 0

Views: 60

Answers (1)

YourFriend
YourFriend

Reputation: 434

Give text-align:center to class navbar-inner and give text-align:left to your Brand Name. Note I gave display:inline property to ul li to put them in a single line. You can see the result here. http://jsfiddle.net/5t5sfx5h/

Upvotes: 1

Related Questions