Browse Button style of RadUpload

Thread is closed for posting
3 posts, 1 answers
  1. Sigma
    Sigma avatar
    87 posts
    Member since:
    Apr 2012

    Posted 31 Aug 2012 Link to this post


    I want to change the style of browse button of RadUpload. I want to change its background image and size. Please help me to achieve this.

    Thanks in advance.
  2. Answer
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 31 Aug 2012 Link to this post


    Try setting the following CSS.
    div.RadUpload .ruBrowse
      background-image: url('../Images/img.jpg') !important;
      height: 60px !important;

  3. Ivan Zhekov
    Ivan Zhekov avatar
    604 posts

    Posted 03 Sep 2012 Link to this post

    That's mostly so.

    In addition to the background image, there is the background position that's been set in the base stylesheet of the RadUpload control.

    If you examine this image (also attached in the thread) -- -- you'll notice it three button parts on the left and three button parts on the right. Those are the parts of each button type (short, medium, long) plus their hover state).

    If you want to use use implied dimensions of the button, I suggest you customize the sprite and set the background image, the way Princy showed.

    If you want to use different dimensions, than the ones implied by the base stylesheet, you'll need to override the background positions of the button as well.

    You can also check a very nice help article on customizing the skins of the Upload control --

    Kind regards,
    Ivan Zhekov
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top