css borders

5 posts, 1 answers
  1. Tab Alleman
    Tab Alleman avatar
    18 posts
    Member since:
    Apr 2010

    Posted 08 Jun 2010 Link to this post

    After much cat-herding, I have got my menu so that when you hover over a top-level item, the item changes colors and the sub-menu slides down.

    I want to add a left- and right- border to the top-level item as well, but when I try, my left border is in the middle of my item.  I guess some space to the left of my item is getting the background color changed?    I can't figure out how to handle this.    Here is the bit of the .css that changes the color:

    .RadMenu_ICR .rmLink:hover .rmText,  
    .RadMenu_ICR .rmExpanded  
    {  
        background-color: #d5ecf1 !important;  
        font: normal 12px/23px "Segoe UI", Arial, sans-serif;  
        color: #003366;  
    } 

     

    to get borders, I am adding:

     

     

    border-right:1px solid #336699;

     

     

    border-left:1px solid #336699;

    what else do I need to do?

     

  2.
  3. Tab Alleman
    Tab Alleman avatar
    18 posts
    Member since:
    Apr 2010

    Posted 09 Jun 2010 Link to this post

    by playing with the visual style builder, I've found that I need to put the borders on .rmLink, and not .rmText.

    However, when I changed that, now my root item only changes background color while I am hovering over it.   When I move the pointer down to the submenu, it changes back to the non-hovered color.    What element do I need to change to affect the root item of the submenu that I am hovering over?
  5. Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 11 Jun 2010 Link to this post

    Hello Tab,

    You need to style the .rmExpanded class (it is added to the anchor tag when the item is expanded). You can also check the other basic RadMenu classes outlined in this documentation article.

    Best wishes,
    Kamen Bundev
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  7. Tab Alleman
    Tab Alleman avatar
    18 posts
    Member since:
    Apr 2010

    Posted 11 Jun 2010 Link to this post

    Thanks for responding, Kamen, but as you see in the code block in my first post, I am including the rmExpanded class in my style block, but it is not working.   Is my syntax incorrect?
  9. Answer
    Kamen Bundev
    Admin
    Kamen Bundev avatar
    1532 posts

    Posted 14 Jun 2010 Link to this post

    Hi Tab,

    Well, you're explicitly setting the background-color property and most skins have background images applied there too, both on the anchor and on the rmText span. Try modifying your CSS rule like this:
    .RadMenu_ICR .rmLink:hover .rmText,  
    .RadMenu_ICR .rmExpanded .rmText
    {  
        background: #d5ecf1 !important;  
        font: normal 12px/23px "Segoe UI", Arial, sans-serif;  
        color: #003366;  
    }

    Greetings,
    Kamen Bundev
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
Back to Top