CODEWITHSUNDEEP
csstwitter-bootstrap
trante
trante

Reputation: 33986

Twitter Bootstrap centering button text

I know that adding text-center to div classes is sufficient for centering a group of buttons. But in my situation I need to center the text inside the buttons.

I tried to add margin-left, margin-right, text-center. But didn't help.
Is it possible to center the text ?

<div id="mydiv">
    <a href="#" class="btn btn-warning btn-lg text-center"
        style="width:48px;margin-left:auto;margin-right:auto;">Ad</a>
    ...
    ...
</div>

fiddle: http://jsfiddle.net/mavent/YXrRT/3/

Upvotes: 0

Views: 96

Answers (5)

Hamed mayahian
Hamed mayahian

Reputation: 2323

check the jsfiddle,you should remove margin-left:auto,margin-right:auto inline code

http://jsfiddle.net/YXrRT/6/

Upvotes: 0

azz
azz

Reputation: 5930

You padding on the buttons is too large (16px horizontally). Try changing the padding to 10px or less.

jsFiddle

Also you should consider using CSS classes instead of style attributes to avoid repetition.

Upvotes: 1

Ricky Stam
Ricky Stam

Reputation: 2126

Don't give any custom CSS like width and margins remove them and it will work. You use Bootstrap so you don't have to use custom stylings for buttons

Upvotes: 0

Top Questions
Top Questions

Reputation: 1852

Try removing 

margin-left:auto;margin-right:auto;

from 

<a href="#" class="btn btn-warning btn-lg text-center" style="width:48px;margin-left:auto;margin-right:auto;">Pp</a>

Upvotes: 0

Gregoire
Gregoire

Reputation: 24832

Add padding-left:0; padding-right:0

Upvotes: 1

Related Questions