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

Sub menu not showing

4 Answers 141 Views
Menu
This is a migrated thread and some comments may be shown as answers.
Clarence
Top achievements
Rank 1
Clarence asked on 16 Oct 2008, 04:53 PM
I have a menu with a sub menu, that has an item with another sub menu.

The last sub menu won't show.  Any help would be appreciated.  Here is the aspx and css code:
<telerik:RadMenuItem NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" CssClass="menuSpeedOrdering"
                        <Items> 
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" GroupSettings-ExpandDirection="Up" GroupSettings-OffsetX="100" GroupSettings-Width="200"
                                <Items> 
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem> 
                                </Items> 
                            </telerik:RadMenuItem>     
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem>     
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" ></telerik:RadMenuItem> 
                        </Items> 
                    </telerik:RadMenuItem>  

/* RadMenu Telerik Skin */ 
/* Text color size and style of whole menu*/ 
 
 
/*Entire menu*/ 
div.RadMenu_Shade ul.rmHorizontal 
    border0px solid #262626
    floatleft
    padding: 0; 
    width795px
    height40px
    margin-leftauto
    margin-rightauto
    /*background: transparent url('../images/menu/light.gif');*/ 
/* Normal Item */ 
.rmHorizontal .rmItem 
    width112px
    height37px
    /*background: transparent url('../images/menu/light.gif');*/ 
 
.rmHorizontal .rmItem .menuSpeedOrdering 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu1.gif'no-repeat 0 0; 
.rmHorizontal .menuSpeedOrdering:hover, .rmHorizontal .menuSpeedOrdering:active 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu1a.gif'no-repeat 0 0; 
 
.rmHorizontal .rmItem .menuCatalogBrowse 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu2.gif'no-repeat 0 0; 
.rmHorizontal .menuCatalogBrowse:hover, .rmHorizontal .menuCatalogBrowse:active 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu2a.gif'no-repeat 0 0; 
 
.rmHorizontal .rmItem .menuProductFinder 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu3.gif'no-repeat 0 0; 
.rmHorizontal .menuProductFinder:hover, .rmHorizontal .menuProductFinder:active 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu3a.gif'no-repeat 0 0; 
.rmHorizontal .rmItem .menuTrackOrders 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu4.gif'no-repeat 0 0; 
.rmHorizontal .menuTrackOrders:hover, .rmHorizontal .menuTrackOrders:active 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu4a.gif'no-repeat 0 0; 
 
.rmHorizontal .rmItem .menuAdminUsers 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu5.gif'no-repeat 0 0; 
.rmHorizontal .menuAdminUsers:hover, .rmHorizontal .menuAdminUsers:active 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu5a.gif'no-repeat 0 0; 
 
.rmHorizontal .rmItem .menuCompanyInfo 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu6.gif'no-repeat 0 0; 
.rmHorizontal .menuCompanyInfo:hover, .rmHorizontal .menuCompanyInfo:active 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu6a.gif'no-repeat 0 0; 
 
.rmHorizontal .rmItem .menuCustService 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu7.gif'no-repeat 0 0; 
.rmHorizontal .menuCustService:hover, .rmHorizontal .rmItem .menuCustService  .menuCustService:active 
    width112px
    height37px
    backgroundtransparent url('../images/menu/btn_menu7a.gif'no-repeat 0 0; 
 
.rmHorizontal .rmLink:hover, 
.rmHorizontal .rmFocused, 
.rmHorizontal .rmExpanded 
    width112px
    height37px
 
.rmHorizontal .rmText 
    padding8px 24px 8px 14px
 
ul.rmVertical 
    border1px solid #808080
    floatleft
    backgroundurl('../images/menu/dropdowndot.gif'repeat
 
.rmVertical .rmItem 
       height20px
       overflow:hidden
       padding-bottom4px
.rmVertical .rmLink 
   height20px
       overflow:hidden
       padding-bottom4px
 
.rmVertical .rmText 
    height20px
       overflow:hidden
    padding-bottom4px
 
.rmVertical .rmExpandRight 
 
.rmVertical .rmLink:hover, 
.rmVertical .rmFocused, 
.rmVertical .rmExpanded 
    colorwhite
    backgroundurl('../images/menu/dropdowndotdark.gif'repeat
    height20px
       overflow:hidden
 
.rmVertical .rmLink:hover .rmText, 
.rmVertical .rmFocused .rmText, 
.rmVertical .rmExpanded .rmText 
   height20px
       overflow:hidden
 
.rmVertical .rmLink:hover .rmExpandRight, 
.rmVertical .rmFocused .rmExpandRight, 
.rmVertical .rmExpanded .rmExpandRight 
   height20px
       overflow:hidden
 
.rmVertical .rmGroup 
   height20px
       overflow:hidden
 
.rmVertical .rmGroup .rmLink 
   height20px
       overflow:hidden
 
.rmVertical .rmGroup .rmText 
   height20px
       overflow:hidden
 
.rmVertical .rmGroup .rmLink:hover, 
.rmVertical .rmGroup .rmFocused, 
.rmVertical .rmGroup .rmExpanded 
   height20px
       overflow:hidden
 
 .rmVertical .rmGroup .rmLink:hover .rmText, 
 .rmVertical .rmGroup .rmFocused .rmText, 
 .rmVertical .rmGroup .rmExpanded .rmText 
   height20px
       overflow:hidden
 
 .rmVertical .rmGroup .rmLink:hover .rmExpandRight, 
 .rmVertical .rmGroup .rmFocused .rmExpandRight, 
 .rmVertical .rmGroup .rmExpanded .rmExpandRight 
   height20px
       overflow:hidden
 
 .rmSeparator 
 
 .rmSeparator .rmText 
 
 .rmTopArrowDisabled, 
 .rmBottomArrowDisabled, 
 .rmLeftArrowDisabled, 
 .rmRightArrowDisabled 
    displaynone
 
 .rmTopArrow, 
 .rmBottomArrow, 
 .rmLeftArrow, 
 .rmRightArrow 
    font-size: 0; 
    color#fff
    line-height: 0; 
 
 .rmTopArrow, 
 .rmBottomArrow 
    height10px
    width: 100%; 
 
 .rmBottomArrow 
    background-positioncenter -18px
 
 .rmLeftArrow, 
 .rmRightArrow 
    width10px
    height: 100%; 
 
 .rmRightArrow 
    background-position: -18px center

4 Answers, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 17 Oct 2008, 11:31 AM
Hello Clarence,

Please remove "overflow: hidden" from the following style to fix this issue:

.rmVertical .rmItem
{
height: 20px;
/* overflow:hidden; */
padding-bottom: 4px;
}

Regards,
Yana
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Clarence
Top achievements
Rank 1
answered on 17 Oct 2008, 12:23 PM
Great!  Thanks.  One more question, how would I add another level?  What is missing or could be changed in the css to to have yet another level of sub menus.
0
Yana
Telerik team
answered on 17 Oct 2008, 01:57 PM
Hi Clarence,

I'm glad I could help.

You don't need to change anything in the css file to have another level. It can be added like this:

<telerik:RadMenuItem NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" CssClass="menuSpeedOrdering" Text="item 3">    
                        <Items>    
                            <telerik:RadMenuItem Text="TEST" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" GroupSettings-ExpandDirection="Up" GroupSettings-OffsetX="100" GroupSettings-Width="200">    
                                <Items>    
                                    <telerik:RadMenuItem Text="TEST2" NavigateUrl="~/orders/speedorder.aspx" ToolTip="Employee" > 
                                        <Items> 
                                            <telerik:RadMenuItem Text="TEST3" /> 
                                            <telerik:RadMenuItem Text="TEST3" /> 
                                        </Items> 
                                    </telerik:RadMenuItem>   
                                   ... 


Kind regards,
Yana
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Clarence
Top achievements
Rank 1
answered on 17 Oct 2008, 02:12 PM
I figured it out.  My .rmVertical .rmGroup also had a overflow:hidden;.  So once I removed that, it worked.
Tags
Menu
Asked by
Clarence
Top achievements
Rank 1
Answers by
Yana
Telerik team
Clarence
Top achievements
Rank 1
Share this question
or