Foros del Web » Creando para Internet » CSS »

Problema Menu en CSS

Estas en el tema de Problema Menu en CSS en el foro de CSS en Foros del Web. Hola amigos he bajado un codigo Css desde Internet, lo he editado el unico problema es en lo relacionado con la ubicacion del submenu. Adjunto ...
  #1 (permalink)  
Antiguo 04/07/2010, 22:10
 
Fecha de Ingreso: abril-2009
Ubicación: Sunchales
Mensajes: 67
Antigüedad: 8 años, 7 meses
Puntos: 0
Problema Menu en CSS

Hola amigos he bajado un codigo Css desde Internet, lo he editado el unico problema es en lo relacionado con la ubicacion del submenu.
Adjunto la primer imagen que es como se ve actualmente, y la segunda imagen es como quisiera que se vea.

IMAGEN 1 (Actualmente)


IMAGEN 2


CODIGO CSS
Código HTML:
#main
	{
		width:1040px;
		float:none;
		margin:0 auto;
		padding:0px;
		background-color:White;
	}
ul#navmenu-h { margin: 0; padding: 0; list-style: none; position: relative;
	top: 0px;
	left: 0px;
	height: 24px;
	width: 1040px;
}
 
ul#navmenu-h ul {
 width: 160px; /* Sub Menu Width */
 margin: 0px;
 list-style: none;
 display: none;
 position: absolute;
 top: 100%;
 left: 0;
}
 
ul#navmenu-h ul ul,ul#navmenu-h ul ul ul { top: 0; left: 100%; }
 
ul#navmenu-h li { float: left; display:inline; position:relative;
	top: 0px;
	left: 0px;
	width: 148px;
	text-align: left;
}
ul#navmenu-h ul li { width: 100%; display: block;
	text-align: left;
}
 
/* Root Menu */
ul#navmenu-h a {
 border-top: 1px solid #FFF;
 border-right: 1px solid #FFF;
 padding: 6px;
 float: left;
 display: block;
 background: #FFF;
 color: #666;
 font: bold 11px Arial, sans-serif;
 text-decoration: none;
 height: 20px;
 width: 137px;
 text-align: left;
}
 
/* Root Menu Hover Persistence */
ul#navmenu-h a:hover,ul#navmenu-h li:hover a,ul#navmenu-h li.iehover a {
 background: #FFF;
 color: #FFF;
}
 
/* 2nd Menu */
ul#navmenu-h li:hover li a,ul#navmenu-h li.iehover li a {
 float: none;
 background: #BBB;
}
 
/* 2nd Menu Hover Persistence */
ul#navmenu-h li:hover li a:hover,ul#navmenu-h li:hover li:hover a,ul#navmenu-h li.iehover li a:hover,ul#navmenu-h li.iehover li.iehover a {
 background: #999;
}
 
/* 3rd Menu */
ul#navmenu-h li:hover li:hover li a,ul#navmenu-h li.iehover li.iehover li a {
 background: #999;
}
 
/* 3rd Menu Hover Persistence */
ul#navmenu-h li:hover li:hover li a:hover,ul#navmenu-h li:hover li:hover li:hover a,ul#navmenu-h li.iehover li.iehover li a:hover,ul#navmenu-h li.iehover li.iehover li.iehover a {
 background: #666;
}
 
/* 4th Menu */
ul#navmenu-h li:hover li:hover li:hover li a,ul#navmenu-h li.iehover li.iehover li.iehover li a {
 background: #666;
}
 
/* 4th Menu Hover */
ul#navmenu-h li:hover li:hover li:hover li a:hover,ul#navmenu-h li.iehover li.iehover li.iehover li a:hover {
 background: #333;
}
 
/* Hover Function - Do Not Move */
ul#navmenu-h li:hover ul ul,ul#navmenu-h li:hover ul ul ul,ul#navmenu-h li.iehover ul ul,ul#navmenu-h li.iehover ul ul ul { display: none; }
ul#navmenu-h li:hover ul,ul#navmenu-h ul li:hover ul,ul#navmenu-h ul ul li:hover ul,ul#navmenu-h li.iehover ul,ul#navmenu-h ul li.iehover ul,ul#navmenu-h ul ul li.iehover ul { display: block; }


CODIGO HTML
Código HTML:
<!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>Wellnet</title> 
    <link href="Styles/Style.css" rel="stylesheet" type="text/css" />
    <script language="JavaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>  
    <script language="JavaScript" type="text/javascript"> 
    $(document).ready(function() {
      $('.links li code').hide();  
      $('.links li p').click(function() {
        $(this).next().slideToggle('fast');
      });
    });
    </script>
    
</head>
<body background="Imagenes/Masterpage/back.jpg" style="background-repeat:repeat-x; 	margin: 0px; padding: 0px; text-align:center">

    
    <div id= "main">
        <img src="Imagenes/MasterPage/Main.jpg" style="width: 1040px; height: 428px" /><br />
        <div>
            <div>
                <div id="page">
                      <div id="body">
                        <div id="content">
                          <ul id="navmenu-h">
                            
                            <li><a href="#" style="background-image: url('Imagenes/Botones/Inicio.png')"></a>
                              <ul>
                                <li><a href="#">Quienes Somos</a></li>
                                <li><a href="#">Que Hacemos</a></li>            
                                <li><a href="#">Donde Estamos</a></li>          
                                <li><a href="#">Staff</a></li>          
                                <li><a href="#">SubDistribución</a></li>          
                                <li><a href="#">Comercio Exterior</a></li>           
                              </ul>    
                             </li>
                            
                            
                            <li><a href="#" style="background-image: url('Imagenes/Botones/Productos.png')"></a>
                              <ul>
                                <li><a href="#">Plataformas Vibratorias</a></li>
                                <li><a href="#">Accesorios</a></li>          
                              </ul>
                            </li>
                            
                            
                            <li><a href="#" style="background-image: url('Imagenes/Botones/InfoCientifica.png')"></a>
                              <ul>
                                <li><a href="#">Que es</a></li>
                                <li><a href="#">Como Funciona</a></li>
                                <li><a href="#">Para Que Sirve</a></li>
                                <li><a href="#">Entrenamiento</a></li>
                                <li><a href="#">Bases Fisiológicas</a></li>
                              </ul>
                            </li>
                            
                            
                          
                            <li><a href="#" style="background-image: url('Imagenes/Botones/Servicios.png')"></a>
                               <ul>
                                <li><a href="#">Opción Comodatos</a></li>
                                <li><a href="#">Proyec. Financiera</a></li>
                                <li><a href="#">Apoyo Publicitario</a></li>
                                <li><a href="#">Servicio Técnico</a></li>
                                <li><a href="#">Capacitación</a></li>
                              </ul>   
                           </li>

                           <li><a href="#" style="background-image: url('Imagenes/Botones/CentrosWN.png')"></a>
                              <ul>
                                <li><a href="#">Argentina</a></li>
                                <li><a href="#">Sport Club</a></li>
                                <li><a href="#">Latinoamerica</a></li>
                              </ul>
                           </li>
                            
                            <li><a href="#" style="background-image: url('Imagenes/Botones/Novedades.png')"></a>
                              <ul>
                                <li><a href="#">Presencia en la Costa</a></li>
                                <li><a href="#">Presencia en las Sierras</a></li>
                                <li><a href="#">Presencia en los C. Sky</a></li>
                                <li><a href="#">Nuevas Aperturas</a></li>
                                <li><a href="#">Sport Club</a></li>
                                
                              </ul>
                            </li>
                            
                            <li><a href="#" style="background-image: url('Imagenes/Botones/Contactenos.png')"></a></li>
                            
                            
                          </ul>
                        </div>
                      </div>
                </div>
            </div>
            <br />
            <img src="Imagenes/MasterPage/Pie03.jpg" style="width: 1026px; height: 238px" alt="" /><br />
        </div>   
   </div>
</body>
</html> 

Espero que alguien me pueda dar una Mano con esto.
Desde ya Muchas gracias.
Nicolas.
  #2 (permalink)  
Antiguo 04/07/2010, 23:20
Avatar de C2am  
Fecha de Ingreso: enero-2009
Ubicación: Rosario, Argentina
Mensajes: 2.005
Antigüedad: 8 años, 10 meses
Puntos: 306
Respuesta: Problema Menu en CSS

Prueba resetear el css, es decir al inicio de tu hoja de estilos coloca algo como esto:

Código CSS:
Ver original
  1. * {margin:0; padding:0;  outline: 0;}
  2. a {outline:none;}
  3. ul {list-style:none}

Saludos
__________________
El mundo nada puede contra un hombre que canta en la miseria.
-- Ernesto Sábato--
  #3 (permalink)  
Antiguo 05/07/2010, 00:09
 
Fecha de Ingreso: abril-2009
Ubicación: Sunchales
Mensajes: 67
Antigüedad: 8 años, 7 meses
Puntos: 0
Respuesta: Problema Menu en CSS

Muchas gracias Cristian, con eso he solucionado mi problema.
Muchas gracias.

Etiquetas: Ninguno
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:20.