Center button text?

[John]

Hi all:

I have a RadToolBar on an ASP.NET Ajax page and expanded the toolbar width to 1280, setting the 9 buttons to widths of 100 to spread them out. I selected the Office2010 silver skin, is there a way to set the button text to be centered? When I run now the text is left-aligned.

John

[Magdalena]

Hello John,

There are several ways to achieve centralization of button text:

1. If you set the property ImagePosition to AboveText, the CSS styles for centering the text will apply from inbuilt styles so you do not have to add any additional CSS. In this solution, the width of the button is set by the control's property Width.
   
   
2. If you are using images and the previous solution do not meet your expectations, you can apply the following CSS

   html .RadToolBar .rtbIn {
       padding-right: 20px;
       position: relative;
       text-align: center;
   }
   
   html .RadToolBar .rtbChoiceArrow {
       position: absolute;
       top: 50%;
       right: 0;
       margin-top: -9px;
   }

    In this solution, the width of the button is set by the control's property Width as well.
   
   
3. If you do not set the width of the button by its property, you can set it by a CSS rule. Then you can add only a rule for aligning the text.

   html .RadToolBar .rtbText {
       width: 65px;
       text-align: center;
   }

Regards,
Magdalena
Telerik