This is a migrated thread and some comments may be shown as answers.

Width and Height support for RadButton

4 Answers 971 Views
Button
This is a migrated thread and some comments may be shown as answers.
Telerik Admin
Top achievements
Rank 1
Iron
Telerik Admin asked on 11 Nov 2010, 12:58 PM
In general RadButton supports custom Width and Height, except when using ButtonType="StandardButton " the height is fixed to 22px and cannot be modified. The implementation of custom height and support for rounded corners, requires rendering of additional HTML elements and makes the control heavy on the client.

In the future releases, we plan to introduce a way to make RadButton more flexible when it comes to using different height.

If custom height is indeed required, try the solutions below:
  • Use RadButton as an ImageButton - see Image Buttons demo.
  • or use RadButton as a LinkButton - see First Look.
  • or use RadButton as a StandardButton with EnableBrowserButtonStyle set to true. Note that this property will render RadButton as a standard input type=[submit|button].


Note that the button's dimensions can be set not only in pixels, but also in different System.Web.UI.WebControls.Unit types.

4 Answers, 1 is accepted

Sort by
0
Tarun
Top achievements
Rank 1
answered on 18 Apr 2012, 01:24 PM
Hi,

Has the support for setting height and width for StandardButton been provided in the Q1 2012 release ?

If no, can you please suggest any work-around to achieve that.

Thanks
Tarun Singla

0
Slav
Telerik team
answered on 20 Apr 2012, 01:18 PM
Hi Tarun,

Since Q1 2011 we introduced a way to have a StandardButton with a height of 65px. You just need to set this value in the Height property of the control to use the bigger size. Also, in addition to the approaches that are listed in the first post there is an option to set a custom height to a StandardButton by modifying its CSS styles and sprite image. This method is described in the help article RadButton Custom Height Tutorial.

Regards,
Slav
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.
0
Tarun
Top achievements
Rank 1
answered on 23 Apr 2012, 11:48 AM
Hi Slav,

Thank you for your response.

The approach mentioned in the help article seems to be a cumbersome task to set the height of button control.

We are creating composite controls, where in, we adjust the dimensions of the RadButton dynamically based on the dimensions specified for the composite control. e.g
Consider a composite control, which is made up of a TextBox and a RadButton with Image (optionally set by properties). I specify some height and width for my composite control. So, i use those dimensions to change the height and width of the RadButton based on the properties of the composite control (like Image Position, Height, Width, etc.)

In such a scenario, its really hectic job to set the Height of the RadButton with the approach mentioned in the help.

Is there any other (simpler) approach to achieve this.

Thanks
Tarun Singla
0
Slav
Telerik team
answered on 23 Apr 2012, 04:12 PM
Hi Tarun,

It is also possible to utilize CSS3 in order to incorporate the desired effect. This approach is much easier for implementation as it does not involve creating custom sprites. You can find more information about this method in the blog post How to set a custom height for RadButton and RadFormDecorated buttons in ASP.NET AJAX. Note CSS3 is supported only by newer browsers, so if you want to target the older versions as well, I would suggest either using the RadButton as a LinkButton or setting its property EnableBrowserButtonStyle to true.

Kind regards,
Slav
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.
Tags
Button
Asked by
Telerik Admin
Top achievements
Rank 1
Iron
Answers by
Tarun
Top achievements
Rank 1
Slav
Telerik team
Share this question
or