Horizontal menu behind RADDropdownList

[Jerry]

I have a web form master page that has a menu across the top, then I have 3 RAD Dropdown lists.

When I access the menu, the menu items are displaying BEHIND the drop down lists, not in front of them.

I am using "default" code from Microsoft for the contents of the master page, and I added the telerik items to that page.

Here is a snippet of the code:

I know it probably has something to do with CSS, but I am not sure where to look?

<form id="form1" runat="server">
    <div class="page">
        <div class="header">
            <div class="title">
                <h1>GLISA Score Entry and Report Processor</h1>
            </div>
            <div class="clear hideSkiplink">
                <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
                </asp:Menu>
            </div>
        </div>
        <div class="main">
            <telerik:RadStyleSheetManager ID="RadStyleSheetManager1" runat="server">
            </telerik:RadStyleSheetManager>
            <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
                <Scripts>
                    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                    <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
                </Scripts>
            </telerik:RadScriptManager>
            <telerik:RadDropDownList
                AppendDataBoundItems="true"
                AutoPostBack="true"
                Width="300px"
                ID="ddl_Season"
                runat="server"
                SelectedText="Please select Season"
                DataSourceID="dsSeasonName"
                DataTextField="SeasonName"
                DataValueField="ID">

[Jerry]

OK - setting the menu div z-index to 999 in the css file fixed it.

Guess I need to read up on CSS more!!

 

[Marin Bratanov]

You may also find useful the following list with the default z-index values of our controls: https://docs.telerik.com/devtools/aspnet-ajax/controls/controlling-absolute-positioning-with-z-index.

Regards,
Marin Bratanov
Progress Telerik