Center button text?

2 posts, 0 answers
  1. John
    John avatar
    41 posts
    Member since:
    Jun 2008

    Posted 20 Sep 2014 Link to this post

    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.

  2. Magdalena
    Magdalena avatar
    411 posts

    Posted 24 Sep 2014 Link to this post

    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;


    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

  3. DevCraft R3 2016 release webinar banner
Back to Top