CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Jonathan Shirion
Jonathan Shirion

Reputation: 39

Align text vertically with Bootstrap

Tried the solution here: vertical-align with Bootstrap 3 and here: vertical-align: middle with Bootstrap 2 didn't work.

This is the page: http://yonicks.com/falican/exemple.htm

Code:

<div class="container">
    <div class="row gray_back">
         <div class="col-md-6 content_area  vcenter ">

             <div class="col-md-2"></div>

             <div class="col-md-10 vcenter">
                 <h1 >text here need to be in the middle vertically</h1>
                 <h1 > also this</h1>
             </div>


             <div class="the_p_area">
                 <div class="col-md-2"> </div>

                  <div class="col-md-10">
                      also this also this also this also this also this also this also this also this

                  </div>

             </div>

         </div>


         <div class="col-md-6">
             <img src="img/fff.png" class="img-responsive" alt="Responsive image">
                        <br>
         </div>

    </div>

</div>

I'm using the latest version of Bootstrap.

How can I make the text align vertically?

Upvotes: 1

Views: 302

Answers (2)

Will
Will

Reputation: 4155

you were close.

.row > .col-md-6 {
    display: table-cell;
    float: none;
    vertical-align: middle;
}

Upvotes: 1

Jose Paredes
Jose Paredes

Reputation: 4080

You Can use! line-height. The property vertical-align is very specific

for exapmple:

.yourclas{
 line-height: 2;
}

Upvotes: 0

Related Questions