MVC dropdownmenu Showing behind partial that is made up of a user control

StackOverflow https://stackoverflow.com/questions/22483488

Question

I am using the viewReport.Cshtml

<div style="width: 100%;z-index: 1000">

    @Html.Partial("WebViewer",Model)

</div>

And load the active reports into a user control. WebViewer.ascx

<head id="Head1" runat="server">
    <title>ReportViewer</title>

    <link rel="stylesheet" type="text/css" href="../../Content/Site.css"/>



</head>
<script runat="server">
    void Page_Load()
    {
        ARWebViewer.Report = ViewBag.ArReport;


    }


</script>


<body>
<br/><br/><br/><br/><br/><br/>
 <%= Html.ActionLink("Back to Report Criteria","Index", "Report")%>


    <div class="divReportViewer" style="overflow-x:auto; height:550px; " >
        <ActiveReportsWeb:WebViewer ID="ARWebViewer" runat="server" ViewerType="AcrobatReader" Width="100%" Height="500px" PdfExportOptions-CenterWindow="True" PdfExportOptions-Version="Pdf11"></ActiveReportsWeb:WebViewer>
    </div>

</body>

My sub menu items are showing behind the viewer. I have tried setting the z-index but not having any luck. Does anyone know how to get the dropdown to come in front of the viewer. I have tried setting the z-index of the dropdown menu to 99999 to see if I can get it to come forward but doesnt seem to work. I am using twitter bootstrap along with MVC so to much code to show the menu.

Was it helpful?

Solution

End up just putting it in a pop up so I dont have to deal with the z-index

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top