Center Text inside button

bicks · June 2015

Hi,

I`ve managed to make the button resize to the whole width of the column, but i`m not able to center the text inside the button. How can I do this? I´ve tried with CSS like this:

media="all" a.button, a.tp-button { width: 100%; text-align:center;}

but it doesn`t work.

this is where i want it:

http://snag.gy/ggrjb.jpg

Thanks.

Albert · June 2015

Hey,

please send us url to page where you got these buttons and we'll see if it is possible to center text inside.

bicks · June 2015

tcp.callibree.com

Albert · June 2015

On which page these buttons are? Because for sure not on homepage.

bicks · June 2015

Yes, sorry.

http://tcp.callibree.com/hormigas/

Albert · June 2015

Ok. So to do this, please use below css:

a.button .button_label { float: none !important; }

bicks · June 2015

Ok, that´s working, but now I´ve lost the 100% width...

Albert · June 2015

Please try below css then and check if this will help you:

a.button, a.tp-button {
    text-align: center !important;
    width: 100%;
}
a.button .button_label { float: none !important; }

We tested it on our side and works fine.

bicks · June 2015

Your code still didn´t fixed it, so finally I tried this and worked:

created a custom class for the button and I added to the custom CSS of the page like this:

.botones { width:100%;}

a.button, a.tp-button {

text-align: center !important;

}

a.button .button_label {

float: none !important;

}

Thanks for the help.

Albert · June 2015

It's weird because the code we gave you above was tested on our side and works on 100%. But if your works fine, then ok.

Center Text inside button

Comments