Radbutton edging out when i set height and width

[Srinivas]

Hi ,

Iam using radbutton in my application , when i set the height and width of the controls to some values then the control is fading out and its
bottom edge, if i dont specifies and height and width its showing its default size.

Even when i set the images they are not showing up on the design time and the rendering on the runtime is not proper.

 

 

 

<Tel:RadButton ID="RadButton1" runat="server" ButtonType="LinkButton" Text=" this is for test" Height="30" >

<Icon PrimaryIconUrl="~/Images/Text.png" SecondaryIconUrl="~/Images/Tiff.png" />

</Tel:RadButton>

and

<Tel:RadButton ID="RadButton2" runat="server" Width="80" Text=" this is for test2" Height="30" >

<Image ImageUrl ="~/Images/Text.png" DisabledImageUrl="~/Images/Tiff.png" />

 

</Tel:RadButton>
and

 

<Tel:RadButton runat="server" ID="btn1" EnableBrowserButtonStyle="true" Text="test" Height="30"

 

BorderStyle="None" />

please help on this.

Thanks,
Srinivas

[Slav]

Hi Srinivas,

I tested the provided code sample, but the RadButtons appear as expected on my end. The specified dimensions are applied correctly and the images that I set are displayed. Please elaborate on the encountered problem as currently its exact effect in not clear to me.

The images added to the button control are not visible in Design view, because they are configured as background via CSS styles, which is not interpreted by Visual Studio.

There could be additional CSS styles on your page that are altering the proper appearance of the RadButton control. If there are such styles, I would suggest removing them and checking if the buttons are displayed correctly. Also, you can verify if the path to the images, used for configuring the RadButtons, is correct.

Kind regards,
Slav
the Telerik team

[Srinivas]

Hi Slav,

Thanks for the reply,

I am not using any other scripts or even Table format to place the control.

I just created a new web application project from the VS template,
Added this code in the simple page.

can you give me you code lines or project file so that i can run it on and see .


Thanks,
Srinivas

[Slav]

Hi Srinivas,

You can find attached the sample project that I created to test your code. Please compare it with your setup and verify if there are differences or if I have missed something.

Regards,
Slav
the Telerik team

[Srinivas]

Hi Slav,

Thanks for your update.
With that codebase i found those scenarios you provided is working , but that does not included my scenario which is failling for me. I tested my scenario on your code base page inlcuding the lines as

<telerik:RadButton ID="RadButton3" runat="server" Text=" this is for test"

 

Height="30">

 

<Icon PrimaryIconUrl="~/Images/arrow_down.png" SecondaryIconUrl="~/Images/arrow_up.png" />

 

</telerik:RadButton>

which shows the difference in declaring the button with your examples in the aspects -

--Not specifying the 'button type' property,
--Not specifying the 'EnableBrowserbuttonSyle' property to 'true'.

(this is the way i used to declare a rad button in previous versions)

Plese refer to the image attached show the results of the above code.

Thanks,
Srinivas

[Slav]

Hello Srinivas,

If you do not set the mentioned properties, the RadButton control will be configured as a StandardButton, which is its default mode. Such button controls have two fixed values for height - 22px and 65px. If you need to set another value, you will have to modify the sprite image and the CSS styles of the RadButton, as described in the help article RadButton Custom Height Tutorial.

Greetings,
Slav
the Telerik team