2010-06-17 13 views
26

Actualmente estoy migrando sitios web a ASP.NET 4.0, teniendo problemas con la nueva representación de los controles de menú. Mis sitios web hacen un uso intensivo de menús anidados. Se utilizan efectos de desplazamiento y el diseño se define mediante una combinación de temas y máscaras con CSS vinculado.ASP.NET 4.0 Problemas de representación con el menú de control después de quitar controlRenderingCompatibilityVersion = "3.5"

Si elimino el atributo pages controlRenderingCompatibilityVersion, ya no se representan como tablas anidadas, sino como etiquetas ul/li. Esto rompe mi diseño de muchas maneras. Cualquier recomendación para una migración de un complejo diseño de menú ASP.NET es muy bienvenida.

Editado: Marcado y detalles CSS como respuesta al comentario

Sección pertinente del archivo de la piel

<asp:Menu runat="server" DynamicHorizontalOffset="2" Orientation="Horizontal" SkipLinkText="" 
    StaticPopOutImageUrl="~/App_Images/Themes/arrow_down.gif" DynamicPopOutImageUrl="~/App_Images/Themes/arrow_right.gif"> 
    <StaticMenuItemStyle CssClass="MenuDefaultMenuItemStyle" /> 
    <DynamicMenuItemStyle CssClass="MenuDefaultMenuItemStyle" /> 

    <StaticSelectedStyle CssClass="MenuDefaultSelectedStyle" /> 
    <DynamicSelectedStyle CssClass="MenuDefaultSelectedStyle" /> 

    <StaticHoverStyle CssClass="MenuDefaultHoverStyle" /> 
    <DynamicHoverStyle CssClass="MenuDefaultHoverStyle" /> 
</asp:Menu> 

<asp:Menu runat="server" SkinId="MenuVertical" DynamicHorizontalOffset="2" SkipLinkText="" 
    StaticPopOutImageUrl="~/App_Images/Themes/arrow_right.gif" DynamicPopOutImageUrl="~/App_Images/Themes/arrow_right.gif"> 
    <StaticMenuItemStyle CssClass="MenuVerticalMenuItemStyle" /> 
    <DynamicMenuItemStyle CssClass="MenuVerticalMenuItemStyle" /> 

    <StaticSelectedStyle CssClass="MenuVerticalSelectedStyle" /> 
    <DynamicSelectedStyle CssClass="MenuVerticalSelectedStyle" /> 

    <StaticHoverStyle CssClass="MenuVerticalHoverStyle" /> 
    <DynamicHoverStyle CssClass="MenuVerticalHoverStyle" /> 
</asp:Menu> 

de estilo

.MenuDefaultMenuItemStyle 
{ 
    background-color: #D5DCE1; 
    color: #234875; 
    padding: 2px; 
    width: 100%; 
} 

.MenuDefaultSelectedStyle 
{ 
    background-color: #3C5778; 
    color: #FFFFFF; 
    padding: 2px; 
    width: 100%; 
} 

.MenuDefaultHoverStyle 
{ 
    background-color: #666666; 
    color: #FFFFFF; 
    padding: 2px; 
    width: 100%; 
} 

.MenuVerticalMenuItemStyle 
{ 
    background-color: #FFFFFF; 
    border: 1px solid #D5DCE1; 
    color: #234875; 
    height: 30px; 
    padding: 2px; 
    width: 100%; 
} 

.MenuVerticalSelectedStyle 
{ 
    background-color: #003366; 
    border: 1px solid #D5DCE1; 
    color: #FFFFFF; 
    height: 30px; 
    padding: 2px; 
    width: 100%; 
} 

.MenuVerticalHoverStyle 
{ 
    background-color: #EEEEEE; 
    border: 1px solid #000000; 
    color: #234875; 
    height: 30px; 
    padding: 2px; 
    width: 100%; 
} 
+0

Tengo el mismo problema en un menú bastante simple. El color de fondo de CSS parece ser ignorado para los elementos de menú que tienen hijos, y mi relleno (tengo la orientación horizontal establecida) también se ignora para los elementos en el menú principal, excepto entre los dos primeros. –

+0

¿Esto sucede también para .net 3.5 cuando se elimina este atributo? si no, entonces .net 4.0 puede tomar un enfoque diferente (más saludable) a HTML/CSS. Como regla general, no confíe en ASP.NET al generar su marcado. Asume un control total sobre él y conoce tu camino a su alrededor. Si pudieras reescribir lo que tienes como un simple XHTML/CSS, te recomendaría esta ruta en lugar de hackear los controles .net. – synhershko

+0

@synhershko: ¿Qué quieres decir con "¿Esto también ocurre para .net 3.5?" En .net 3.5 ¡este atributo no tiene sentido y no existe! Hackear los controles .net no es la intención de nadie aquí. Tim y yo seguimos las mejores prácticas de ayer (Construí tu diseño usando temas, máscaras y CSS). Debería haber una ruta de migración fácil a las mejores prácticas actuales. –

Respuesta

32

Si quita el atributo controlRenderingCompatibilityVersion desde web. configurar el modo predeterminado para la representación del menú cambia implícitamente de Table a List. Si todavía quiere tener su menú de renderizado con etiquetas de tabla necesita especificar esta manera explícita en su asp: control de menú añadiendo el atributo RenderingMode: (. S también la sección de observaciones aquí en MSDN: http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.menu.renderingmode.aspx)

<asp:Menu runat="server" RenderingMode="Table" ... > 
    ... 
</asp:Menu> 

3

Tuve problemas cuando un menú publicado se rindió de forma extraña. Agregar RenderingMode = "List" al menú de marcado resolvió mis problemas.

<asp:Menu runat="server" RenderingMode="List" ... > 
    ... 
</asp:Menu> 
Cuestiones relacionadas