CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
user3590557
user3590557

Reputation: 21

Text Alignment in Bootstrap

I'm developing a bootstrap style website and I have text that needs centering. I've centered it in the horizontal dimension by using center align but I dont know how to center it vertically in the row.

<div class="col-md-6">
    <p align="center">Some Text that needs centering.</p>
</div>

The 'align="center"' takes care of the horizontal alignment but I dont know how to put the text in the absolute center of the row.

Upvotes: 2

Views: 209

Answers (3)

DivineChef
DivineChef

Reputation: 1221

Here's an example that should help it retains the bootstrap class. You can also view it in this demo.

HTML

   <div class="cont .col-md-6">
    <h1>Some text</h1>
    </div>

CSS

    .cont {
     border: 1px solid #333;
     width: 400px;
     background: #eee;
  }

Upvotes: 0

Jonathan
Jonathan

Reputation: 1564

With bootstrap you have text alignment helper classes:

<p class="text-left">Left aligned text.</p>
<p class="text-center">Center aligned text.</p>
<p class="text-right">Right aligned text.</p>
<p class="text-justify">Justified text.</p>

http://getbootstrap.com/css/#type-emphasis (you need to scroll down a little)

you can also set an element to display: block and center via margin.

<div class="center-block">...</div>

paragraph tags should automatically be block level elements

Upvotes: 1

wahid
wahid

Reputation: 1150

Hope this will work. 

<div class="col-md-6">
  <p style="display:inline-block; vertical-align:middle">Some Text that needs centering.</p>
</div>

Upvotes: 0

Related Questions