Ali Shaikh
Ali Shaikh

Reputation: 121

Bootstrap - Centre Navbar Text

I am trying to centre the text in this example but it doesnt seem to be possible

<div class="col-md-10">
  <br>
  <br>

  <div class="navbar navbar-default">

    <div class="container">
      <p style="font-size: 12pt;" class="navbar-text"><strong>Centre this Text</strong>
      </p>


    </div>
  </div>
</div>

Upvotes: 0

Views: 76

Answers (3)

vanburen
vanburen

Reputation: 21653

You have to change the float:left to float:none since this is inside a navbar.

See example Snippet.

.navbar.navbar-default p.navbar-text {
  text-align: center;
  float: none;
  font-size: 12pt;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="navbar navbar-default">
  <div class="container">
    <div class="row">
      <div class="col-md-12">
        <p class="navbar-text"><strong>Centre this Text</strong>

        </p>
      </div>
    </div>
  </div>
</div>

Upvotes: 3

jfoutch
jfoutch

Reputation: 1398

Or add .navbar.navbar-default .navbar-text { text-align: center; } to your stylesheet

Upvotes: 0

Adi Nugroho
Adi Nugroho

Reputation: 161

It's worked

<div class="col-md-10">
  <br>
  <br>

  <div class="navbar navbar-default">

    <div class="container">
      <p style="font-size: 12pt;" class="navbar-text" align="center"><strong>Centre this Text</strong>
      </p>


    </div>
  </div>
</div>

Upvotes: 0

Related Questions