asp:Menu bug?

  • Thread starter Thread starter Mark B
  • Start date Start date
M

Mark B

Is there a bug in the ASP.NET menu control?:

IE7.




HTML:
<asp:Menu ID="Menu1" runat="server"
DataSourceID="SiteMapDataSource1" Orientation="Horizontal"
StaticEnableDefaultPopOutImage="False" Width="950px">
</asp:Menu>


<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="False" />



Theme skin:

<%-- ASP Menu Vertical --%>
<asp:Menu runat="server"
CssClass="aspMenu"
DynamicMenuItemStyle-CssClass="aspMenuDynamicMenuItem"
DynamicMenuStyle-CssClass="aspDynamicMenu"
DynamicHoverStyle-CssClass="aspMenuDynamicHover"
StaticHoverStyle-CssClass="aspMenuStaticHover"
StaticMenuItemStyle-CssClass="aspMenuStaticMenuItem"
StaticSubMenuIndent="0"
</asp:Menu>
<%-- ASP Menu Horizontal --%>
<asp:Menu runat="server"
CssClass="aspMenu1"
DynamicHoverStyle-CssClass="aspMenuDynamicHover1"
DynamicMenuItemStyle-CssClass="aspMenuDynamicMenuItem1"
Orientation="horizontal"
SkinID="Menu1"
StaticHoverStyle-CssClass="aspMenuStaticHover1"
StaticMenuItemStyle-CssClass="aspMenuStaticMenuItem1"
<LevelSubMenuStyles>
<asp:SubMenuStyle CssClass="" />
<asp:SubMenuStyle CssClass=""
/>


<asp:SubMenuStyle CssClass="aspMenuDynamicMenuLevel3" />
</LevelSubMenuStyles>
</asp:Menu>


<%-- ASP SiteMapPath --%>
<asp:SiteMapPath runat="server"
CssClass="aspSiteMapPath"
/>



/*-- ASP Menu --*/
/*-- Vertical Orientation --*/
..aspMenu
{
background-color: #eeeeee !important;
background-image: url(./Images/menu_headerbg.jpg) !important;
background-repeat: repeat-x !important;
}
..aspMenuDynamicHover
{
height: 25px !important;
}

..aspMenuDynamicHover tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;}

..aspMenuDynamicMenuItem
{
background-color: #eeeeee !important;
height: 25px !important;
}

..aspMenuDynamicMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
height: 25px !important;
margin-left: 20px;
margin-right:20px;
}

..aspMenuStaticMenuItem
{
padding: 5px 10px;
border-bottom-color: #cccccc !important;
border-bottom-style: solid !important;
border-bottom-width: 1px !important;
text-align:left;
}

..aspMenuStaticMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;

font-size: 9pt !important;

font-weight: bold !important;

text-decoration: none !important;

}

..aspMenuStaticMenuItem tr td a:Hover

{

color: #000000 !important;

font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}

/*-- ASP Menu --*/
/*-- Horizontal Orientation --*/
..aspMenu1
{
background-image: url(./Images/shared_headerbg.gif) !important;
background: url(./Images/shared_headerbg.gif) !important;
background-repeat: repeat-x !important;
height: 34px !important;
padding-left: 5px !important;
padding-right: 5px !important;
}

..aspMenuDynamicHover1
{
}
..aspMenuDynamicMenuItem1
{
background-color: #eeeeee !important;
}
..aspMenuDynamicMenuItem1 tr td a
{

color: #686872 !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #3333CC !important;
}

..aspMenuDynamicMenuItem1 tr td a:Hover
{
color: #000000 Lime !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #6699FF !important;
}

..aspMenuDynamicMenuLevel3
{
margin-left: 96px !important;
}

..aspMenuStaticHover1
{

}

..aspMenuStaticMenuItem1
{
}
..aspMenuStaticMenuItem1 tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}
..aspMenuStaticMenuItem1 tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}

/*-- ASP SiteMapPath --*/
..aspSiteMapPath
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
}

..aspSiteMapPath a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
text-decoration: none !important;
}

..aspSiteMapPath a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
text-decoration: none !important;
}
 
Just to Troubleshoot:
Does this happen on long items on every menu? Or is it just this one?

If just one, it could be another element with a higher z-order that is
interfering. You can change z-order to see if this is the case.

I use the CSS friendly adapters personally. They use the standard list
format for menus, which is very common with CSS. I am not fond of the tables
created by the menu control.

--
Gregory A. Beamer
MVP; MCP: +I, Se, SD, DBA

Blog:
http://feeds.feedburner.com/GregoryBeamer

*************************************************
| Think outside the box! |
*************************************************
Is there a bug in the ASP.NET menu control?:

IE7.




HTML:
<asp:Menu ID="Menu1" runat="server"
DataSourceID="SiteMapDataSource1" Orientation="Horizontal"
StaticEnableDefaultPopOutImage="False" Width="950px">
</asp:Menu>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server"
ShowStartingNode="False" />

Theme skin:
<%-- ASP Menu Vertical --%>
<asp:Menu runat="server"
CssClass="aspMenu"
DynamicMenuItemStyle-CssClass="aspMenuDynamicMenuItem"
DynamicMenuStyle-CssClass="aspDynamicMenu"
DynamicHoverStyle-CssClass="aspMenuDynamicHover"
StaticHoverStyle-CssClass="aspMenuStaticHover"
StaticMenuItemStyle-CssClass="aspMenuStaticMenuItem"
StaticSubMenuIndent="0"</asp:Menu>
<%-- ASP Menu Horizontal --%>
<asp:Menu runat="server"
CssClass="aspMenu1"
DynamicHoverStyle-CssClass="aspMenuDynamicHover1"
DynamicMenuItemStyle-CssClass="aspMenuDynamicMenuItem1"
Orientation="horizontal"
SkinID="Menu1"
StaticHoverStyle-CssClass="aspMenuStaticHover1"
StaticMenuItemStyle-CssClass="aspMenuStaticMenuItem1"<LevelSubMenuStyles>
<asp:SubMenuStyle CssClass="" />
<asp:SubMenuStyle CssClass=""
/>
<asp:SubMenuStyle CssClass="aspMenuDynamicMenuLevel3" />
</LevelSubMenuStyles>
</asp:Menu>

<%-- ASP SiteMapPath --%>
<asp:SiteMapPath runat="server"
CssClass="aspSiteMapPath"
/>

/*-- ASP Menu --*/
/*-- Vertical Orientation --*/
..aspMenu
{
background-color: #eeeeee !important;
background-image: url(./Images/menu_headerbg.jpg) !important;
background-repeat: repeat-x !important;
}
..aspMenuDynamicHover
{
height: 25px !important;
}
..aspMenuDynamicHover tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;}
..aspMenuDynamicMenuItem
{
background-color: #eeeeee !important;
height: 25px !important;
}
..aspMenuDynamicMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
height: 25px !important;
margin-left: 20px;
margin-right:20px;
}
..aspMenuStaticMenuItem
{
padding: 5px 10px;
border-bottom-color: #cccccc !important;
border-bottom-style: solid !important;
border-bottom-width: 1px !important;
text-align:left;
}
..aspMenuStaticMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
text-decoration: none !important;
}
..aspMenuStaticMenuItem tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}
/*-- ASP Menu --*/
/*-- Horizontal Orientation --*/
..aspMenu1
{
background-image: url(./Images/shared_headerbg.gif) !important;
background: url(./Images/shared_headerbg.gif) !important;
background-repeat: repeat-x !important;
height: 34px !important;
padding-left: 5px !important;
padding-right: 5px !important;
}
..aspMenuDynamicHover1
{
}
..aspMenuDynamicMenuItem1
{
background-color: #eeeeee !important;
}
..aspMenuDynamicMenuItem1 tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #3333CC !important;
}
..aspMenuDynamicMenuItem1 tr td a:Hover
{
color: #000000 Lime !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #6699FF !important;
}
..aspMenuDynamicMenuLevel3
{
margin-left: 96px !important;
}
..aspMenuStaticHover1
{
}
..aspMenuStaticMenuItem1
{
}
..aspMenuStaticMenuItem1 tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}
..aspMenuStaticMenuItem1 tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}
/*-- ASP SiteMapPath --*/
..aspSiteMapPath
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
}
..aspSiteMapPath a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
text-decoration: none !important;
}
..aspSiteMapPath a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
text-decoration: none !important;
}
 
- long items on every menu


Cowboy (Gregory A. Beamer) said:
Just to Troubleshoot:
Does this happen on long items on every menu? Or is it just this one?

If just one, it could be another element with a higher z-order that is
interfering. You can change z-order to see if this is the case.

I use the CSS friendly adapters personally. They use the standard list
format for menus, which is very common with CSS. I am not fond of the
tables created by the menu control.

--
Gregory A. Beamer
MVP; MCP: +I, Se, SD, DBA

Blog:
http://feeds.feedburner.com/GregoryBeamer

*************************************************
| Think outside the box! |
*************************************************
Is there a bug in the ASP.NET menu control?:

IE7.




HTML:
<asp:Menu ID="Menu1" runat="server"
DataSourceID="SiteMapDataSource1" Orientation="Horizontal"
StaticEnableDefaultPopOutImage="False" Width="950px">
</asp:Menu>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server"
ShowStartingNode="False" />

Theme skin:
<%-- ASP Menu Vertical --%>
<asp:Menu runat="server"
CssClass="aspMenu"
DynamicMenuItemStyle-CssClass="aspMenuDynamicMenuItem"
DynamicMenuStyle-CssClass="aspDynamicMenu"
DynamicHoverStyle-CssClass="aspMenuDynamicHover"
StaticHoverStyle-CssClass="aspMenuStaticHover"
StaticMenuItemStyle-CssClass="aspMenuStaticMenuItem"
StaticSubMenuIndent="0"
</asp:Menu>
<%-- ASP Menu Horizontal --%>
<asp:Menu runat="server"
CssClass="aspMenu1"
DynamicHoverStyle-CssClass="aspMenuDynamicHover1"
DynamicMenuItemStyle-CssClass="aspMenuDynamicMenuItem1"
Orientation="horizontal"
SkinID="Menu1"
StaticHoverStyle-CssClass="aspMenuStaticHover1"
StaticMenuItemStyle-CssClass="aspMenuStaticMenuItem1"
<LevelSubMenuStyles>
<asp:SubMenuStyle CssClass="" />
<asp:SubMenuStyle CssClass=""
/>
<asp:SubMenuStyle CssClass="aspMenuDynamicMenuLevel3" />
</LevelSubMenuStyles>
</asp:Menu>

<%-- ASP SiteMapPath --%>
<asp:SiteMapPath runat="server"
CssClass="aspSiteMapPath"
/>

/*-- ASP Menu --*/
/*-- Vertical Orientation --*/
.aspMenu
{
background-color: #eeeeee !important;
background-image: url(./Images/menu_headerbg.jpg) !important;
background-repeat: repeat-x !important;
}
.aspMenuDynamicHover
{
height: 25px !important;
}
.aspMenuDynamicHover tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;}
.aspMenuDynamicMenuItem
{
background-color: #eeeeee !important;
height: 25px !important;
}
.aspMenuDynamicMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
height: 25px !important;
margin-left: 20px;
margin-right:20px;
}
.aspMenuStaticMenuItem
{
padding: 5px 10px;
border-bottom-color: #cccccc !important;
border-bottom-style: solid !important;
border-bottom-width: 1px !important;
text-align:left;
}
.aspMenuStaticMenuItem tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
text-decoration: none !important;
}
.aspMenuStaticMenuItem tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}
/*-- ASP Menu --*/
/*-- Horizontal Orientation --*/
.aspMenu1
{
background-image: url(./Images/shared_headerbg.gif) !important;
background: url(./Images/shared_headerbg.gif) !important;
background-repeat: repeat-x !important;
height: 34px !important;
padding-left: 5px !important;
padding-right: 5px !important;
}
.aspMenuDynamicHover1
{
}
.aspMenuDynamicMenuItem1
{
background-color: #eeeeee !important;
}
.aspMenuDynamicMenuItem1 tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #3333CC !important;
}
.aspMenuDynamicMenuItem1 tr td a:Hover
{
color: #000000 Lime !important;
font-family: 'Trebuchet MS' , Arial, Helvetica, 'Sans-serif !important';
font-size: 9pt !important;
font-weight: bold !important;
background-color: #6699FF !important;
}
.aspMenuDynamicMenuLevel3
{
margin-left: 96px !important;
}
.aspMenuStaticHover1
{
}
.aspMenuStaticMenuItem1
{
}
.aspMenuStaticMenuItem1 tr td a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}
.aspMenuStaticMenuItem1 tr td a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
font-weight: bold !important;
}
/*-- ASP SiteMapPath --*/
.aspSiteMapPath
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
}
.aspSiteMapPath a
{
color: #686872 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
text-decoration: none !important;
}
.aspSiteMapPath a:Hover
{
color: #000000 !important;
font-family: 'Trebuchet MS', Arial, Helvetica, Sans-serif !important;
font-size: 9pt !important;
text-decoration: none !important;
}
Click to expand...
 
If you can try it, consider the CSS adapters. They are not that hard to
include in with the current site and produce a standard

<ul>
<li></li>
</ul>

list.

As for the standard menu, there are tons fo places to add styles. I would
examine where you have placed the CSS and dink around with it a bit. It may,
or may not, produce a proper result. If you are sold on the standard
implementation, you can examine the output, but I would personally consider
this an exercise in futility with the CSS Friendly Adapters.

The originals are here
http://www.asp.net/CssAdapters/

The CodePlex project is here
http://www.codeplex.com/cssfriendly

--
Gregory A. Beamer
MVP; MCP: +I, Se, SD, DBA

Blog:
http://feeds.feedburner.com/GregoryBeamer

*************************************************
| Think outside the box! |
*************************************************
 
Back
Top