This is a migrated thread and some comments may be shown as answers.

Expand Arrow not showing up

1 Answer 99 Views
Menu
This is a migrated thread and some comments may be shown as answers.
AL
Top achievements
Rank 1
AL asked on 21 Oct 2009, 08:18 PM
I have a horizontal menu and I am not able to display the "down arrow gif" on a root menu item which has child items. How would a user know if one of the root menu item has child items if the down arrow is not showing up? I need to display down arrow on a root menu items that has child items. Any help would be great, because I am stuck for 8 hours in it.

Here is my css:-----------------------------------------------------------------------------------------
/* r.a.d.menu Web 2.0 skin */

.RadMenu_Blue
{
    background: url(Menu/MenuItemBackground.gif);
    border-left: solid 1px #617fb5;
}

.RadMenu_Blue_Context
{
    background: none;
    border:0;
}

.RadMenu_Blue .rmLink
{
    text-decoration: none;
    color: #fff;
    border-left: solid 1px #c1d3ea;
    border-right: solid 1px #1d4375;
    background: transparent;
}

.RadMenu_Blue .rmLink:hover,
.RadMenu_Blue .rmFocused,
.RadMenu_Blue .rmExpanded
{
    color: #FFFFFF;
    background: transparent url(Menu/MainItemBackgroundHover.gif) no-repeat center;
    height:28px;
}

.RadMenu_Blue .rmText
{
    /*background: transparent url(Menu/RootGroupArrowDown.gif) no-repeat right center;*/
    padding-left: 22px; /* should be adjusted to the size of the images, if they are larger than 16x16px */
    margin-right: 4px;
    font: bold 12px Arial, Verdana, Sans-serif;
    line-height: 26px;
    padding-right: 24px;
}


.RadMenu_Blue .rmRootGroup .rmText .rmLeftImage
{
    margin: 3px 1px 0; /* should be adjusted to the size of the images, if they are larger than 16x16px */
}

.RadMenu_Blue .rmHorizontal .rmExpandBottom
{
  background: transparent url(Menu/RootGroupArrowDown.gif) no-repeat right center;
}  
.RadMenu_Blue .rmHorizontal .rmExpandTop  
{  
  background: transparent url(Menu/RootGroupArrowDown.gif) no-repeat right center;  
}

.RadMenu_Blue .rmVertical .rmExpandLeft,
.RadMenu_Blue .rmVertical .rmExpandRight  
{  
  background: transparent url(Menu/invertedGroupImage.gif) no-repeat right center;  
}


.RadMenu_Blue .rmSlide
{
    margin-top:-1px;
}

.RadMenu_Blue .rmGroup
{
    border: solid 1px #6788be;
    background: white;
}

.RadMenu_Blue .rmGroup .rmLink
{
    background: white;
    border: 0px;
    border-bottom: solid 1px #f0f2f3;
    color: #333;
}

.RadMenu_Blue .rmGroup .rmText
{
    font-weight: normal !important;
    background: none;
    margin-right: 0 !important;
    padding-left: 30px;
    padding-right: 40px;
    font-size: 11px;
}

.RadMenu_Blue .rmGroup .rmLink:hover,
.RadMenu_Blue .rmGroup .rmFocused,
.RadMenu_Blue .rmGroup .rmExpanded
{
    background: #e7f1ff;
    border: 0;
    border-bottom: solid 1px #d8dde0;
}

.RadMenu_Blue .rmLeftArrow,
.RadMenu_Blue .rmRightArrow,
.RadMenu_Blue .rmTopArrow,
.RadMenu_Blue .rmBottomArrow,
.RadMenu_Blue .rmLeftArrowDisabled,
.RadMenu_Blue .rmRightArrowDisabled,
.RadMenu_Blue .rmTopArrowDisabled,
.RadMenu_Blue .rmBottomArrowDisabled
{
    background: #e7f1ff url(Menu/left.gif) center center no-repeat;
    width: 15px;
    text-decoration:none;
    color:#e7f1ff;
}

.RadMenu_Blue .rmTopArrow,
.RadMenu_Blue .rmTopArrowDisabled
{
    background-image: url(Menu/top.gif);
    width: 100%;
    height: 15px;
}

.RadMenu_Blue .rmBottomArrow,
.RadMenu_Blue .rmBottomArrowDisabled
{
    background-image:url(Menu/bottom.gif);
    width: 100%;
    height: 15px;
}

.RadMenu_Blue .rmRightArrow,
.RadMenu_Blue .rmLeftArrow
{
    height: 100%;
}

.RadMenu_Blue .rmRightArrow,
.RadMenu_Blue .rmRightArrowDisabled
{
    background-image: url(Menu/right.gif);
}

.RadMenu_Blue .rmVertical .rmSeparator
{
    padding-top: 2px;
    background: #6788be;
    font-size: 1px;
    line-height: 1px;
}

.RadMenu_Blue .rmSeparator .rmText
{
    display: none;
}

.RadMenu_Blue .rmExpandLeft,
.RadMenu_Blue .rmExpandRight,
.RadMenu_Blue .rmFocused .rmExpandLeft,
.RadMenu_Blue .rmFocused .rmExpandRight,
.RadMenu_Blue .rmExpanded .rmExpandLeft,
.RadMenu_Blue .rmExpanded .rmExpandRight
{
    background: transparent url(Menu/invertedGroupImage.gif) right center no-repeat;
}

.RadMenu_Blue .rmGroup .rmExpandLeft,
.RadMenu_Blue .rmGroup .rmExpandRight,
.RadMenu_Blue .rmGroup .rmFocused .rmExpandLeft,
.RadMenu_Blue .rmGroup .rmFocused .rmExpandRight,
.RadMenu_Blue .rmGroup .rmExpanded .rmExpandLeft,
.RadMenu_Blue .rmGroup .rmExpanded .rmExpandRight
{
    background: transparent url(Menu/groupImage.gif) right center no-repeat;
}

/*right-to-left support*/

.RadMenu_Blue_rtl,
.RadMenu_Blue_rtl *
{
    text-align:right;
}

.RadMenu_Blue_rtl .rmRootGroup .rmText
{
    padding-left: 24px;
    padding-right: 8px;
    margin-right: 0;
    margin-left: 4px;
}

.RadMenu_Blue_rtl .rmGroup .rmText
{
    margin-left: 0 !important;
    padding-left: 40px;
    padding-right: 30px;
}

.RadMenu_Blue .rmLeftImage
{
    margin: 5px 2px 0;
}

.RadMenu_Blue_rtl .rmHorizontal .rmExpandBottom,  
.RadMenu_Blue_rtl .rmHorizontal .rmExpandTop  
{  
  background-position:left center;  
}

.RadMenu_Blue_rtl .rmVertical .rmExpandLeft,
.RadMenu_Blue_rtl .rmVertical .rmExpandRight  
{  
  background: transparent url(Menu/invertedGroupImageRTL.gif) no-repeat left center;
}

.RadMenu_Blue_rtl .rmGroup .rmExpandLeft,
.RadMenu_Blue_rtl .rmGroup .rmExpandRight  
{  
  background: transparent url(Menu/groupImageRTL.gif) no-repeat 5px center;  
}

.RadMenu_Blue_rtl .rmVertical .rmLink:hover .rmExpandLeft,
.RadMenu_Blue_rtl .rmVertical .rmLink:hover .rmExpandRight,
.RadMenu_Blue_rtl .rmVertical .rmFocused .rmExpandLeft,
.RadMenu_Blue_rtl .rmVertical .rmFocused .rmExpandRight,
.RadMenu_Blue_rtl .rmVertical .rmExpanded .rmExpandLeft,
.RadMenu_Blue_rtl .rmVertical .rmExpanded .rmExpandRight
{
    background: transparent url(Menu/invertedGroupImageRTL.gif) left center no-repeat;
}

.RadMenu_Blue_rtl .rmGroup .rmLink:hover .rmExpandLeft,
.RadMenu_Blue_rtl .rmGroup .rmLink:hover .rmExpandRight,
.RadMenu_Blue_rtl .rmGroup .rmFocused .rmExpandLeft,
.RadMenu_Blue_rtl .rmGroup .rmFocused .rmExpandRight,
.RadMenu_Blue_rtl .rmGroup .rmExpanded .rmExpandLeft,
.RadMenu_Blue_rtl .rmGroup .rmExpanded .rmExpandRight
{
    background: transparent url(Menu/groupImageRTL.gif) 5px center no-repeat;
}

.RadMenu_Blue .rmRootGroup .rmItem .rmDisabled,
.RadMenu_Blue .rmRootGroup .rmItem .rmDisabled:hover
{
    -moz-opacity: 0.8;
    opacity: 0.8;
    color: #ccc;
    background: none;
    border-bottom-color: #f3f5f5;
}

1 Answer, 1 is accepted

Sort by
0
AL
Top achievements
Rank 1
answered on 21 Oct 2009, 09:16 PM
Found the solution:--

Changed from :--
.RadMenu_Blue .rmHorizontal .rmExpandBottom

to:--


.RadMenu_Blue .rmHorizontal .rmExpandDown


Tags
Menu
Asked by
AL
Top achievements
Rank 1
Answers by
AL
Top achievements
Rank 1
Share this question
or