Add Vertical Separator "ON" RadToolBarSplitButton

3 posts, 1 answers
  1. jlj30
    jlj30 avatar
    101 posts
    Member since:
    Jan 2011

    Posted 21 Mar 2014 Link to this post

    Hi,

    Some of our users are finding it difficult to grasp the difference between a RadToolBarSplitButton  and a RadToolBarDropDown.
    It seems that the subtle difference in the vertical offset of the dropdown arrow is not sufficient.

    So, we'd like to add a thin vertical bar (like a separator) between the image and the dropdown arrow on the split button.
    One solution that comes to mind is to add this bar to the image itself, but the image changes so we'd need to modify all of the images.

    Is there some other technique that we could employ to accomplish this?

    Thanks in advance for any advice.

    Jim
  2. Answer
    Kate
    Admin
    Kate avatar
    1898 posts

    Posted 25 Mar 2014 Link to this post

    Hi Jim,

    You could use the following css class selector and set a verticla border to the arrow image:
    div.RadToolBar_Silk .rtbExpandDown .rtbIn .rtbChoiceArrow {
         border-left: 1px solid #FF0000;
    }

    Please note that this is valid for the Silk skin and you will need to alter the name of the selector should you happen to use any other skin of the RadToolBar control.

    Regards,
    Kate
    Telerik
     

    Build cross-platform mobile apps using Visual Studio and .NET. Register for the online webinar on 03/27/2014, 11:00AM US ET.. Seats are limited.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. jlj30
    jlj30 avatar
    101 posts
    Member since:
    Jan 2011

    Posted 25 Mar 2014 in reply to Kate Link to this post

    Hi Kate,

    I used a slightly modified version of what you provided.
    I think it will do the job.

    Thanks a lot

    Jim
Back to Top