0

I am using asp:Menu for the first time and running into a problem.

I have a horizontal menu with four options. The third option is "Filter". Hovering over "Filter" produces a vertical drop-down menu with several options, two of which are "Filter Category One" and "Filter Category Two". The dropdown menu with those options looks fine until I hover over one of the options (such as "Filter Category One") that has children.

At that time a blank line appears under "Filter Category One" at the same time that its own menu options (children) appear off to the right. Also a blank line appears at the bottom of the level-3 menu, which is the child menu that appears when I hover over "Filter Category One". In other words, the menu with the options Filter 1.1, Filter 1.2, and Filter 1.3 (see below) has a blank line below Filter 1.3.

I suspect (but am not positive) that the blank line between Filter Category One and Filter Category Two when hovering over Filter Category One has the same cause as the extra blank line that appears after Filter 1.3.

My customer uses only IE 8. I browsed using Firefox and Chrome and did not experience this particular problem. (Many other problems showed up, but not this particular one.)

I've found complaints about asp:Menu and IE8 at stackoverflow and elsewhere, but I have not seen a complaint identical to mine.

I would appreciate any help.

I'll be happy to attach a pic if there is a way to upload one.

FOLLOW-UP: We use IE8 Quirks Mode. The problem disappears in IE 8 Standards or IE 7 Standards mode (though other problems appear).

<asp:Menu 
                    OnMenuItemClick="Menu_ItemSelected"
                    Orientation="Horizontal" 
                    ID="MainMenu" 
                    runat="server" 

                    StaticDisplayLevels="1"

                    DynamicHoverStyle-BackColor="LightGray" 
                    DynamicHoverStyle-BorderColor="Black"
                    DynamicHoverStyle-BorderStyle="Solid" 
                    DynamicHoverStyle-BorderWidth="1" 

                    StaticMenuItemStyle-BorderColor="gray"
                    StaticMenuItemStyle-BorderWidth="1" 
                    StaticMenuItemStyle-BorderStyle="Solid" 
                    StaticMenuItemStyle-HorizontalPadding="15px" 

                    DynamicMenuStyle-BorderColor="Black"
                    DynamicMenuStyle-BorderStyle="Solid" 
                    DynamicMenuStyle-BorderWidth="1" 
                    DynamicMenuStyle-BackColor="WhiteSmoke"
                    DynamicMenuStyle-HorizontalPadding="0" 

                    DynamicMenuItemStyle-HorizontalPadding="5"
                    DynamicMenuItemStyle-Font-Size="X-Small"

                    >
                    <Items>
                        <asp:MenuItem Text="Home" NavigateUrl="javascript:mainPage_Click()" />
                        <asp:MenuItem Text="Job Details" NavigateUrl="javascript:jobDetailsPage_Click()" />

                        <asp:MenuItem Selectable="false" Text="Filter">

                            <asp:MenuItem Selectable="true" Text="Clear Filter"/>

                            <asp:MenuItem Selectable="false" Text="Filter Category One">
                                <asp:MenuItem Selectable="true" Text="Filter 1.1"/>
                                <asp:MenuItem Selectable="true" Text="Filter 1.2"/>
                                <asp:MenuItem Selectable="true" Text="Filter 1.3"/>
                            </asp:MenuItem>

                            <asp:MenuItem Selectable="false" Text="Filter Category Two">
                                <asp:MenuItem Selectable="true" Text="Filter 2.1"/>
                                <asp:MenuItem Selectable="true" Text="Filter 2.2"/>
                                <asp:MenuItem Selectable="true" Text="Filter 2.3"/>
                            </asp:MenuItem>

                        </asp:MenuItem>

                        <asp:MenuItem Text="Help" NavigateUrl="ITOBPSLADB_help.htm" Target="_blank" />                            
                    </Items>
                </asp:Menu>
4

1 回答 1

2

无法在兼容性视图中使用以下代码和 IE8 复制您的问题。请更正我的文档类型或此处与您的不同的任何内容，以便此代码在 IE8 中也中断/显示空白行。

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication3._Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
     <asp:Menu 
                    OnMenuItemClick="Menu_ItemSelected"
                    Orientation="Horizontal" 
                    ID="MainMenu" 
                    runat="server" 

                    StaticDisplayLevels="1"

                    DynamicHoverStyle-BackColor="LightGray" 
                    DynamicHoverStyle-BorderColor="Black"
                    DynamicHoverStyle-BorderStyle="Solid" 
                    DynamicHoverStyle-BorderWidth="1" 

                    StaticMenuItemStyle-BorderColor="gray"
                    StaticMenuItemStyle-BorderWidth="1" 
                    StaticMenuItemStyle-BorderStyle="Solid" 
                    StaticMenuItemStyle-HorizontalPadding="15px" 

                    DynamicMenuStyle-BorderColor="Black"
                    DynamicMenuStyle-BorderStyle="Solid" 
                    DynamicMenuStyle-BorderWidth="1" 
                    DynamicMenuStyle-BackColor="WhiteSmoke"
                    DynamicMenuStyle-HorizontalPadding="0" 

                    DynamicMenuItemStyle-HorizontalPadding="5"
                    DynamicMenuItemStyle-Font-Size="X-Small"

                    >
                    <Items>
                        <asp:MenuItem Text="Home" NavigateUrl="javascript:mainPage_Click()" />
                        <asp:MenuItem Text="Job Details" NavigateUrl="javascript:jobDetailsPage_Click()" />

                        <asp:MenuItem Selectable="false" Text="Filter">

                            <asp:MenuItem Selectable="true" Text="Clear Filter"/>

                            <asp:MenuItem Selectable="false" Text="Filter Category One">
                                <asp:MenuItem Selectable="true" Text="Filter 1.1"/>
                                <asp:MenuItem Selectable="true" Text="Filter 1.2"/>
                                <asp:MenuItem Selectable="true" Text="Filter 1.3"/>
                            </asp:MenuItem>

                            <asp:MenuItem Selectable="false" Text="Filter Category Two">
                                <asp:MenuItem Selectable="true" Text="Filter 2.1"/>
                                <asp:MenuItem Selectable="true" Text="Filter 2.2"/>
                                <asp:MenuItem Selectable="true" Text="Filter 2.3"/>
                            </asp:MenuItem>

                        </asp:MenuItem>

                        <asp:MenuItem Text="Help" NavigateUrl="ITOBPSLADB_help.htm" Target="_blank" />                            
                    </Items>
                </asp:Menu>
    </div>
    </form>
</body>
</html>
于 2012-11-02T21:19:29.113 回答