estoy haciendo una web para mi empresa y quiero menus horizontales.
Vi como ponerlo y mas o menos lo logre. pero tengo algunos problemitas.
con la barra de inicio a la izquierda el menu "contacto" se pone debajo de inicio
yo quiero que el menu este de punta a punta del #container dejando un margen de 15 px de cada lado
probe poniendole 100% pero en el tamaño del menu pero no funciono
ahora tiene medida en pixeles pero cuando cambia la resolucion del monitor pasa eso de la foto
aca el codigo:
Código:
el menu tiene un "efecto especial" q, asi nomas muestra la parte de arriba de una imagen y cuando le pones el mouse encima muestra la otra parte de la imagen<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<style type="text/css">
<!--INICIO DEL CODIGO DEL MENU-->
#menu {
list-style-type: none;
padding: 0px;
float:right;
margin-top: 0px;
margin-right: 15px;
margin-bottom: 0px;
margin-left: 15px;
}
#menu li {
margin: 1px;
padding: 1px;
border:1px solid#be0000;
float: left;
}
#menu li a {
display:block;
width:173px;
text-align:center;
font-size:17px;
color:#006;
background-image:url(images/boton1.png);
border:1px solid #666666;
padding-top: 10px;
padding-right: 5px;
padding-bottom: 10px;
padding-left: 5px;
font-family: Helvetica-CondensedLight;
}
li a:hover {
color:#000000;
background-position:bottom;
}
<!--FIN DEL CODIGO DEL MENU-->
#cabecera {
overflow: auto;
width: 100%;
background-color: #606062;
}
#logo {
margin: 15px;
}
body {
background-attachment: fixed;
background-repeat: no-repeat;
background-position: center center;
</style>
</head>
<body bgcolor="#E3E3E3">
<div id="cabecera">
<div align="center" id="logo"><img src="Images/quo.png" width="295" height="116" align="middle" /><br><br><img src="Images/quowebl.png" width="603" height="38" align="absbottom" /></div>
<ul id="menu">
<li><a href="#"> Inicio </a></li>
<li><a href="laempresa.html"> La empresa </a></li>
<li><a href="servicios.html"> Servicios </a></li>
<li><a href="promociones.html"> Promociones </a></li>
<li><a href="noticias.html"> Noticias </a></li>
<li><a href="contacto.html"> Contacto </a></li>
</ul>
</div>
</body>
</html>
espero q me puedan dar una mano...
quiero q el menu este de lado a lado de la web sin importar la resolucion ni el navegador. para eso el menu tendria q tener medida en % pero la verdad ni idea...
espero su respuesta ^^
