How do you set the RadMenu selected color?

5 posts, 1 answers
  1. Matt
    Matt avatar
    33 posts
    Member since:
    Nov 2010

    Posted 07 Aug 2013 Link to this post

    Greetings

    This is a really easy one to answer.

    I'm using the RadMenu with the metro skin. It's all looking great but I want to change the selected menu item's background color.

    Currently the background changes to blue and the text to white when a menu item is clicked. I have tried to override this with:

    .RadMenu_Metro .rmItem a::selection
    {
        background-color: #239300 !important;
    }

    But no luck. It's a tricky one to catch using the web browser developer tools as it changes on the click event.

    Thanks in advance,
    Matt
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 07 Aug 2013 Link to this post

    Hi Matt,

    Try overriding the default CSS as follows.

    CSS:
    <style type="text/css">
        .RadMenu_Metro .rmSelected
        {
            background-color: Green !important;
        }
    </style>

    Thanks,
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Matt
    Matt avatar
    33 posts
    Member since:
    Nov 2010

    Posted 07 Aug 2013 Link to this post

    Sorry, that did not achieve the effect I was after. 

    It's the sub menu items that I want to change (I might not have explained that clearly)

    I hope the attached shows what I am trying to change.

    Matt
  5. Answer
    Kate
    Admin
    Kate avatar
    1898 posts

    Posted 08 Aug 2013 Link to this post

    Hi Matt,

    In order to alter the background color of the selected child items of the RadMenu you can use the following css class selector:
    div.RadMenu_Metro .rmGroup .rmFocused,
           div.RadMenu_Metro .rmGroup .rmFocused:hover,
           div.RadMenu_Metro .rmGroup .rmSelected,
           div.RadMenu_Metro .rmGroup .rmSelected:hover,
           div.RadMenu_Metro .rmGroup .rmExpanded,
           div.RadMenu_Metro .rmGroup .rmExpanded:hover {
               background-color: red;
           }

    Regards,
    Kate
    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.
  6. Matt
    Matt avatar
    33 posts
    Member since:
    Nov 2010

    Posted 08 Aug 2013 Link to this post

    Beautiful. I knew it would be easy.
    Thank you.
    Matt
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017