CSS help with Radbutton

[Ryan]

I am using the radbuttons with the icon.  All works fine except it displays funny with my current CSS.  My Margins are messing up the display of the radbutton.  What are the class's I can use to over write this margin on my radbuttons?

input {
    margin: 3px 5px 5px 5px;
    background-color: #ffffff;
    color: #000000;
    border: 1px solid #c2c2c2;}

[Shinu]

Hi Ryan,

I guess you want to set margin for the icon inside the RadButton. Please check the following sample code.

ASPX:

<telerik:RadButton ID="RadButton1" runat="server" Text="Delete">
    <Icon PrimaryIconUrl="../Images/Close.png" />
</telerik:RadButton>

CSS:

<style type="text/css">
    .rbPrimaryIcon
    {
        left: 11px !important;
        top: 6px !important;
    }
</style>

Thanks,
Shinu.

[Ryan]

That did not help.

Here is what the buttons looks like.

[Ryan]

Here is what is the html generated.

[Shinu]

Hi Ryan,

Unfortunately I couldn't replicate this issue at my end. Can you please send the full code you tried?

Thanks,
Shinu.

[Danail Vasilev]

Hello Ryan,

I can suggest you to examine thoroughly Distorted Appearance help article that treats a similar issue. Said shortly, when you have a global CSS set it may distort the appearance of the script controls on the page. What you can do, in order to handle this is to remove all the custom CSS from you page layout and if that fixes the issue, then start turning one by the styles until you find and fix the problematic style rule.

Regards,
Danail Vasilev
Telerik