How to automatically redraw submenu in CSS and ASP:MENU

Viewed 22
Hello guys, im trying to use the code in CSS and in ASP:MENU to redraw menu when browser changes the size or positions, and the submenus hides to right side.
Here is my screenshot to understand it.

See below image

And there is my code in CSS
.main_menu {
    /*width: 100px;*/
    background-color: #d9d9d9;
    color: #000;
    text-align: left;
    /*height: 30px;*/
    /*line-height: 30px;*/
    margin-right: 2px;
    padding: 5px;
    padding-left: 5px;
    padding-right: 5px;
    /*margin-left:-100px;*/
    top: 0;
    left: 100%;
    flex-direction: row;
}

.level_menu {
    /*width: 110px;*/
    background-color: #d9d9d9;
    color: #000;
    text-align: center;
    /*height: 30px;*/
    /*line-height: 30px;*/
    margin-top: 4px;
    padding: 5px;
    /*top: 0;
    left: 100px;*/
    /*margin-left: -130px;*/
}

.selected_option:hover {
    background-color: #595959;
    color: #000;
}

.sublevel_menu {
    top: 0;
    float:none;
}

@media (max-width:1415px) {
    .sublevel_menu {
        /*left: -101%;*/
        float:left;
    }
}
And also this is my code in ASP:MENU
<asp:Menu ID="mnuPrincipal" runat="server" DataSourceID="PlanillasAsiAdmDS" Orientation="Horizontal" DynamicHorizontalOffset="15" DynamicVerticalOffset="2" MaximumDynamicDisplayLevels="5">
                                <StaticMenuItemStyle  CssClass="level_menu"/>
                                <DynamicMenuItemStyle  CssClass="main_menu" />

                                <DynamicSelectedStyle CssClass="sublevel_menu" />
                                                             
                                <StaticHoverStyle  ForeColor="White" BackColor="SlateGray" />
                                <DynamicHoverStyle ForeColor="White" BackColor="SlateGray" />

                                <DynamicMenuStyle VerticalPadding="5px" />
                                <StaticMenuStyle HorizontalPadding="5px" />

                                <LevelMenuItemStyles>
                                    <asp:MenuItemStyle CssClass="sublevel_menu" />
                                </LevelMenuItemStyles>
                                <LevelSubMenuStyles>
                                    <asp:SubMenuStyle CssClass="sublevel_menu" />
                                </LevelSubMenuStyles>
                                                                
                            </asp:Menu>
0 Answers
Related