No Space Between Items?

2 posts, 0 answers
  1. Mike
    Mike avatar
    8 posts
    Member since:
    Apr 2011

    Posted 03 Aug 2011 Link to this post

    I'm trying to simulate a bullet chart with a radrating control.  What I need is the individual items in the control to not have space between them.  I need the rating control to look like one solid image.  I don't see any attributes on the control to do this, is there any CSS that might help?

    Thanks,
    Jamie
  2. Bozhidar
    Admin
    Bozhidar avatar
    678 posts

    Posted 04 Aug 2011 Link to this post

    Hello Jamie,

    You could achieve that with the following style:

    .RadRating ul li
        {
            margin-right: -3px;
        }

    Changing the margin right value will change the space between rating items. if you change it to minus 10, the items will overlap each other:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <style type="text/css">
        .RadRating ul li
        {
            margin-right: -10px;
        }
    </style>
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <telerik:RadRating ID="RadRating1" runat="server" ItemCount="5" Value="3" SelectionMode="Continuous"
            Precision="Half" Orientation="Horizontal" />
        </form>
    </body>
    </html>


    Best wishes,
    Bojo
    the Telerik team

    Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top