ASP.NET menu problem in IE8

If you use the ASP.NET menu on any of your web sites and just upgraded to IE8 then you probably just noticed that the drop down menu may have a white background.

What IE8 is doing is correct (by design), in the sense that in Standards mode IE8 is following the standards. By default the (element).currentStyle.zIndex returns "auto" when the zindex has not been set. The ASP.NET menu controls just assumes a different value. :)

Override the zindex property. Like such:

CSS

<style type="text/css">
   .IE8MenuFix
   {
      z-index: 100;
   }
</style>

HTML

<DynamicMenuStyle CssClass="IE8MenuFix" />

Modal Progress Display for ASP.NET

If you use the AJAX Extensions in your ASP.NET web site then you've probably used the UpdateProgess control to display that some action is processing in the background.

Here is a code snippet of a simple Modal type processing box I use for some static notifications of some action.

HTML:

<asp:UpdateProgress ID="UpdateProgress2" runat="server" DynamicLayout="False" DisplayAfter="1">
    <ProgressTemplate>
        <div class="PageWorkingBackground">
        </div>
        <div class="UpdateProgress">
            <asp:Image ID="Image1" runat="server" ImageUrl="~/images/SEIB-Validating.gif" AlternateText="[image]" />
            <asp:Image ID="ajaxLoadNotificationImage" runat="server" ImageUrl="~/images/bar_loader.gif"
                AlternateText="[image]" />
        </div>
    </ProgressTemplate>
</asp:UpdateProgress>

CSS:

.PageWorkingBackground
{
position: fixed;
top: 0;
left: 0;
background-color:Gray;
filter:alpha(opacity=75);
opacity:0.75;
height: 100%;
width: 100%;
min-height: 100%;
min-width: 100%

}

.UpdateProgress
{
background-color:#fff;
width: 150px;
text-align: center;
vertical-align: middle;
position: fixed;
bottom: 50%;
left: 45%;
border: solid 2px #453825;
margin: 10px;
padding: 10px;
}

Here is a picture of the modal box in action: