Geek Answers Handbook

Center text below

How can I center the text under the button inside the column inside the row? I want to align the text in the tag <small>exactly in the center under the button:

HTML:

<div class="container">
            <div class="row">
                <div class="col-md-9 vcenter">
                   <h2>Talk to us about your <span class="u">next</span> building project. </h2>
                </div>
                <div class="col-md-3">
                    <button class="btn btn-quote">Get A Free Quote</button>
                    <small>We will contact you within 24 hours.</small>
                </div>
            </div>
        </div>

Current result

What I want

+4
source share
3 answers

Is the button in the center? If so, you just need to provide Text-align: centeryour <small>div.

Can you give an idea of ​​the behavior you want?

Edit: Even if so, the text is not in the center, you can add one or both of: display: blockand / or width: 100%in<small>

+2
source 
small {
   display: block; 
   text-align: center; 
}

This turns into a lock and centers the inner text.

, .

+2

, , ? ? ?

If the answer is yes to one of them, you can go with:

small {
   display: block; 
   text-align: center; 
}

If not, you need to wrap the button and the small one in another container.

http://codepen.io/Type-Style/pen/dXOyGW

0
source

More articles:


All Articles