SoloCodigo

CLR: .Net / Mono / Boo / Otros CLR => ASP .NET => Mensaje iniciado por: Johana84 en Jueves 25 de Noviembre de 2010, 14:03

Título: asp:Menu horizontal
Publicado por: Johana84 en Jueves 25 de Noviembre de 2010, 14:03
Hola a todos

Tengo en el master page en la parte superior el siguiente Menu:
Código: Text
  1. <td valign="top" class="ImageCell" width="100%" height="100%">
  2.  <div runat="server" id="imagen" class="Menusuperior">
  3.  <asp:Image ID="Barraverde" runat="server"
  4.  ImageUrl="~/Images/ima_home/barra.gif"
  5.  Width="100%" Height="76px" /> <br/>
  6.  
  7.  <asp:Menu ID="Menusuperior" runat="server"
  8.   Orientation="Horizontal" ForeColor="#D60C21"
  9.   StaticDisplayLevels="1"
  10.   MaximumDynamicDisplayLevels="0">
  11.   <Items>
  12.   <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Inicio">
  13.    <asp:MenuItem NavigateUrl="~/Cart.aspx" Text="Canasta"></asp:MenuItem>
  14.    <asp:MenuItem NavigateUrl="~/Checkout/Default.aspx" Text="Cuenta"></asp:MenuItem>
  15.    <asp:MenuItem NavigateUrl="~/Profile/Default.aspx" Text="Registro"></asp:MenuItem>
  16.    <asp:MenuItem NavigateUrl="~/Contact.aspx" Text="Contacto"></asp:MenuItem>
  17.    <asp:MenuItem NavigateUrl="~/HelpUser.aspx" Text="Ayuda"></asp:MenuItem>
  18.    </asp:MenuItem>
  19.   </Items>
  20.   </asp:Menu>
  21.   </div>
  22.   </td>
  23.  
  24.  
  25.  
El problema que tengo con este menu es que me aparece vertical, apesar de que tengo especificado  orientation="Horizontal" .

Alguien puede ayudarme por favor?

Gracias

Johana
Título: Re: asp:Menu horizontal
Publicado por: The Black Boy en Jueves 25 de Noviembre de 2010, 20:40
Bueno,

aunque no se ve todo el fuente, puede ser que el menú esté declarado dentro de una tabla que no lo deja expandirse horizontalmente, yo acabo de replicar tu codigo y me ha funcionado perfectamente.

un
saludo
Título: Re: asp:Menu horizontal
Publicado por: Johana84 en Jueves 25 de Noviembre de 2010, 21:02
Hola

Gracias por contestar, te pongo el codigo :

Código: Text
  1. <body class="<%= PageContext.Current.PageGroup %>">
  2.     <form id="form1" runat="server">
  3.         <asp:SiteMapDataSource runat="server" ID="SiteMapDataSource" StartFromCurrentNode="false"  
  4.              StartingNodeUrl="~/Browse.aspx" StartingNodeOffset="-1"
  5.             ShowStartingNode="false" SiteMapProvider="SiteMap" />
  6.         <div runat="server" id="container">
  7.           <div runat="server" id="banner" style="background-color: #FFFFFF; width: 100%;">
  8.            <table cellpadding="0" cellspacing="0" class="TablaRegistro" width="100%">
  9.                 <tr>
  10.                     <td rowspan="2" class="ImageCell" valign="top">
  11.                         <div runat="server" id="branding" class="TablaFila">
  12.                             <asp:HyperLink ID="HyperLink6"  runat="server" CssClass="TablaFila" NavigateUrl="~/">Mi sitio
  13.                             </asp:HyperLink>
  14.                         </div>
  15.                     </td>
  16.                     <td valign="top" class="ImageCell" width="100%" height="100%">
  17.                           <td valign="top" class="ImageCell" width="100%" height="100%">
  18.                                <div runat="server" id="imagen" class="Menusuperior">
  19.                                   <asp:Image ID="Barraverde" runat="server" ImageUrl="~/Images/ima_home/barra.gif"
  20.                                          Width="100%" Height="76px" /> <br/>
  21.                                   <asp:Menu ID="Menusuperior" runat="server"  Orientation="Horizontal" ForeColor="#D60C21"
  22.                                       StaticDisplayLevels="1" MaximumDynamicDisplayLevels="0">
  23.                                   <Items>
  24.                                     <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Inicio">
  25.                                     <asp:MenuItem NavigateUrl="~/Cart.aspx" Text="Canasta"></asp:MenuItem>
  26.                                     <asp:MenuItem NavigateUrl="~/Checkout/Default.aspx" Text="Cuenta"></asp:MenuItem>
  27.                                     <asp:MenuItem NavigateUrl="~/Profile/Default.aspx" Text="Registro"></asp:MenuItem>
  28.                                     <asp:MenuItem NavigateUrl="~/Contact.aspx" Text="Contacto"></asp:MenuItem>
  29.                                     <asp:MenuItem NavigateUrl="~/HelpUser.aspx" Text="Ayuda"></asp:MenuItem>
  30.                                     </asp:MenuItem>
  31.  </Items>
  32.    </asp:Menu>
  33. </div>
  34. </td>             
  35.  
  36.  
Podrias decirme que es lo que tengo malo en la tabla?

Gracias
Johana
Título: Re: asp:Menu horizontal
Publicado por: The Black Boy en Jueves 25 de Noviembre de 2010, 21:12
tu tabla no esta mal

lo que pasa es que tienes el menu  dentro de un "<td></td>" es mejor que le crees un nuevo row "<tr><td>menu</td></tr>"

prueba y me cuentas
Título: Re: asp:Menu horizontal
Publicado por: Johana84 en Jueves 25 de Noviembre de 2010, 22:07
Hola
El siguiente dibujo representa el codigo anterior, Intente poner el menu en un row aparte pero se me desordenaron las otras partes que componen el frame superior.

Nota: el logo de la empresa y el asp:Image deben formar una sola imagen.
Título: Re: asp:Menu horizontal
Publicado por: Johana84 en Viernes 3 de Diciembre de 2010, 16:25
Hola Black boy

Probe colocando el asp:menu dentro de un div en otra página diferente al master, y me sigue apareciendo el menu vertical.

Gracias
Johana
Título: Re: asp:Menu horizontal
Publicado por: Josselo en Sábado 4 de Diciembre de 2010, 01:22
Probe tu codigo y el menu aparece correctamente
por que no pruebas usando hojas de estilo css

ahi puedes poner la direccion de cada menu ademas te servira mucho y te recomendaria que utilices solo divs y las tablas dentro de los divs para que puedas separan tus componentes.

saludos.
Título: Re: asp:Menu horizontal
Publicado por: Johana84 en Lunes 6 de Diciembre de 2010, 15:49
Hola

 Gracias por contestar, pero que parte de codigo probo y te funciono, por que yo probe solo el bloque donde este el menu, en otra página diferente al master page y me aparece vertical, por favor si me pueden orientar si los agradezco mucho.

Código: Text
  1. <div runat="server" id="imagen" >
  2.                     <asp:Image ID="Image1" runat="server"
  3.                            ImageUrl="~/Images/ima_home/L2_Cabezote17.gif"
  4.                            Width="100%" Height="76px" /> <br/>
  5.                            
  6.                     <asp:Menu ID="Menusuperior" runat="server"
  7.                          Orientation="Horizontal">
  8.                               <Items>
  9.                                 <asp:MenuItem NavigateUrl="~/Default.aspx"
  10.                                      Text="Inicio" ></asp:MenuItem>
  11.                                 <asp:MenuItem NavigateUrl="~/Cart.aspx"
  12.                                      Text="Canasta"></asp:MenuItem>
  13.                                 <asp:MenuItem NavigateUrl="~/Checkout/Default.aspx"
  14.                                      Text="Cuenta"></asp:MenuItem>    
  15.                                 <asp:MenuItem NavigateUrl="~/Profile/Default.aspx"
  16.                                      Text="Registro"></asp:MenuItem>
  17.                                 <asp:MenuItem NavigateUrl="~/Contact.aspx"
  18.                                      Text="Contacto"></asp:MenuItem>
  19.                                  <asp:MenuItem NavigateUrl="~/HelpUser.aspx"
  20.                                      Text="Ayuda">                    
  21.                                   </asp:MenuItem>                                    
  22.                             </Items>                                
  23.                    </asp:Menu>                              
  24.            </div>        
  25.  

Gracias
Johana
Título: Re: asp:Menu horizontal
Publicado por: Johana84 en Jueves 9 de Diciembre de 2010, 15:34
Hola a todos

Ya pude solucionar mi problema, gracias por la ayuda.
El código me quedo asi:
Código: Text
  1. <div runat="server" id="imagen" >
  2.                             <asp:Image ID="Image1" runat="server"
  3.                                ImageUrl="~/Images/ima_home/L2_Cabezote17.gif"
  4.                                Width="100%" Height="76px" />
  5.                           </div>
  6.                              
  7.                            <div id="Menusuper">
  8.                             <asp:Menu ID="Menusuperior" runat="server"
  9.                                    Orientation="Horizontal">
  10.                               <Items>
  11.                                 <asp:MenuItem NavigateUrl="~/HelpUser.aspx"
  12.                                      Text="Ayuda"></asp:MenuItem>
  13.                                 <asp:MenuItem NavigateUrl="~/Contact.aspx"
  14.                                       Text="Contacto"></asp:MenuItem>                                    
  15.                                 <asp:MenuItem NavigateUrl="~/Profile/Default.aspx"
  16.                                       Text="Registro"></asp:MenuItem>
  17.                                 <asp:MenuItem NavigateUrl="~/Checkout/Default.aspx"
  18.                                       Text="Cuenta"></asp:MenuItem>
  19.                                 <asp:MenuItem NavigateUrl="~/Cart.aspx"
  20.                                       Text="Canasta"></asp:MenuItem>                                  
  21.                                 <asp:MenuItem NavigateUrl="~/Default.aspx"
  22.                                       Text="Inicio"></asp:MenuItem>
  23.                               </Items>                                
  24.                             </asp:Menu>                                                        
  25.                          </div>
  26.  
 
 y el código del css:

#Menusuper
 {
    list-style:none;    
    color:#D60C21;
    text-decoration:none;   
    border:0px;
    margin-right:100px;      
 }
 #Menusuper li
 {
    float:right;
    margin:2px;
    padding:2px;
    display:block;
 }
 #Menusuper li a
 {
    text-decoration:none;
    color:#D60C21;   
 }
 
Muchas gracias de nuevo por la ayuda
Johana