CSS help with Radbutton

6 posts, 0 answers
  1. Ryan
    Ryan avatar
    52 posts
    Member since:
    Sep 2010

    Posted 05 Jul 2013 Link to this post

    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;}
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 08 Jul 2013 Link to this post

    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.

  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ryan
    Ryan avatar
    52 posts
    Member since:
    Sep 2010

    Posted 08 Jul 2013 Link to this post

    That did not help.

    Here is what the buttons looks like.
  5. Ryan
    Ryan avatar
    52 posts
    Member since:
    Sep 2010

    Posted 08 Jul 2013 Link to this post

    Here is what is the html generated.
  6. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 08 Jul 2013 Link to this post

    Hi Ryan,

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

    Thanks,
    Shinu.
  7. Danail Vasilev
    Admin
    Danail Vasilev avatar
    1490 posts

    Posted 10 Jul 2013 Link to this post

    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
    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 the blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017