Urgente problema con menu horizontal

elkpo15 · #1 (**permalink**) 11/02/2010, 00:06

Hola a todas las gentes de la comunidad forosdelweb, bueno hace poco empeze con html y css no mas de 20 dias, mi problema consiste en cuando voy a crear un menu horizontal los botones me quedan bien y todo, pero siempre me queda un espacio libre al final del menu de la parte derecha, no le encontre la solucion probe de mil maneras, aca les dejo el codigo

Codigo HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xml:lang="es">
<head>
<title>Actives Gaming - Pagina creada por Alan</title>

<link rel="stylesheet" href="Estilos.css" type="text/css">
<meta name="description" content="Juegos, counter strike, mu online, informatica, musica">
</head>
<body>

<div id="cabezera">
Comienzo de la cabezera
</div>
<ul id="menuhorizontal">
<center>
<li><a href="">Nada</a></li>
<li><a href="">Nada</a></li>
<li><a href="">Nada</a></li>
<li><a href="">Nada</a></li>
</center>
</ul>

Codigo CSS:

#menuhorizontal
{
font-family:Arial;
width:100%;
list-style-type:none;
padding:0px;
margin:0px;
}

#menuhorizontal a:visited, #menuhorizontal a:link
{
position:relative;
top:7px;
width:150px;
text-decoration:none;
background-color:#000000;
color:#999999;
border-style:outset;
padding:2px 5px;
}

#menuhorizontal a:hover
{
background-color:#CCCCCC;
color:#FFFFFF
}

#menuhorizontal li
{
display:inline
}

Cual puede ser el problema?
Salu2

elkpo15 · #2 (**permalink**) 11/02/2010, 02:28

No saben que puede ser es urgente por favor :(

Pepbeer · #3 (**permalink**) 11/02/2010, 02:39

Asi rapidamente prueba con:

#menuhorizontal a:visited, #menuhorizontal a:link
{
position:relative;
top:7px;
width:150px;
text-decoration:none;
background-color:#000000;
color:#999999;
border-style:outset;
padding:2px 5px;
}

Quita la ultima linea (padding:2px 5px;). Si no es eso comentalo y lo pruebo bien.

elkpo15 · #4 (**permalink**) 11/02/2010, 02:50

No eso no puede ser por que es adentro del "boton" osea 2px la separacion de y, 5px la separacion de x dentro del boton, el problema es que me queda un hueco a la derecha del menu, onda que se ven los 4 botones y la derecha de todo no queda relleno, queda el hueco y me gustaria que los 4 botones tengan una medida que multiplicado por 4 rellene el width al 100% de la linea del menuhorizontal.
Salu2

elkpo15 · #5 (**permalink**) 11/02/2010, 21:51

Ya lo arregle el tema de los botones, una pregunta, alguien sabe como hacer para ke los botones no hagan salto de linea a medida que voy alchicando el mozilla tienen idea?

jomaruro · #6 (**permalink**) 14/02/2010, 05:29

Hola:

Para centrar prueba a cambiar esto:

Código:

#menuhorizontal {
font-family:Arial;
width:100%;
list-style-type:none;
padding:0px;
margin:0 auto;
}

Y para que no se te descoloque el menú al reducir el navegador prueba con

Código:

min-width: 950px;

Lógicamente los 950px son un ejemplo, tú adáptalo a tus necesidades.

Saludos.