list-style in panelbar

3 posts, 0 answers
  1. Andrew
    Andrew avatar
    171 posts
    Member since:
    Jun 2009

    Posted 12 Sep 2012 Link to this post

    I am trying to add a circle to my subitems in the panel bar
    I have tried this css code:
    .RadPanelBar ul.rpGroup {
        list-style-type:circle !important;
    }

    This does not do anything at all. I checked with firebug in firefox and my line is at the top, i have even added the !important tag to overwrite everything else. But still no help.

    I am using the metro skin. Because i am keen to keep lots of the functionality it already has. I have made some small changes that worked but this one just does not.

    I have attached a screenshot from firebug showing my code at the top.

    Anyone know why this is happening?
  2. Kate
    Admin
    Kate avatar
    1898 posts

    Posted 14 Sep 2012 Link to this post

    Hello Andrew,

    Indeed the appearance that you are trying to achieve does not come out of the box and there are several styles that you will need to alter in order to get the desired look. Attached to to this post you can find a simplified runnable page where you can find an example demonstrating how you can get the desired look.

    Regards,
    Kate
    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.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Andrew
    Andrew avatar
    171 posts
    Member since:
    Jun 2009

    Posted 14 Sep 2012 Link to this post

    Thanks Kate.

    That in itself was not exactly what i needed, as it made my menu items all out of synch layout wise.
    Most likely due to the styling i have already aplied.

    But using your code i have found perfect solution for myself by simple adding :
    div.RadPanelBar .rpGroup .rpItem
    {
        list-style: disc inside none;
    }
             
    div.RadPanelBar .rpGroup .rpText
    {
        display: list-item;
    }

    To my own style and it works just like i need it to.

    Thanks again.
Back to Top