Foros del Web » Creando para Internet » CSS »

Centrando mi menu <ul>

Estas en el tema de Centrando mi menu <ul> en el foro de CSS en Foros del Web. Hola a todos: Acabo de crear un menu de navegacion muy basico usando puro css en HTML, esta basadao en <ul> y funcion bien por ...
  #1 (permalink)  
Antiguo 19/02/2010, 22:04
 
Fecha de Ingreso: septiembre-2009
Mensajes: 6
Antigüedad: 8 años, 3 meses
Puntos: 0
Pregunta Centrando mi menu <ul>

Hola a todos:

Acabo de crear un menu de navegacion muy basico usando puro css en HTML, esta basadao en <ul> y funcion bien por ahora, pero no tengo idea de como puede centrarlo asi que les pedia su ayuda. Este es mi HTML.
Código HTML:
<div id="topmenu">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Developer's Blog</a></li>
</ul>
</div> 
Y me CSS:

Código:
/* Top-Menu */
#topmenu
{
	color: #FFF;
	background-color: #616D7E;
	height: 50px;		
}

#topmenu ul li a
{	
	float: left;
	color: #FFF;
	font-family: ‘Trebuchet MS’, Helvetica, sans-serif;
	font-size: 18px;
	margin: 15px 6px 0 6px;
	text-decoration: underline;
}
Se agradecen mucho las ideas.
  #2 (permalink)  
Antiguo 19/02/2010, 22:20
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 9.968
Antigüedad: 9 años, 8 meses
Puntos: 1314
Respuesta: Centrando mi menu <ul>

Fácil, solo agrega en #topemenu, margin: 0 auto; es la forma en que puedes centrar con CSS.

Saludos
__________________
Grupo Telegram Docker en Español
  #3 (permalink)  
Antiguo 19/02/2010, 22:26
 
Fecha de Ingreso: septiembre-2009
Mensajes: 6
Antigüedad: 8 años, 3 meses
Puntos: 0
Respuesta: Centrando mi menu <ul>

Cita:
Iniciado por Carlangueitor Ver Mensaje
Fácil, solo agrega en #topemenu, margin: 0 auto; es la forma en que puedes centrar con CSS.

Saludos
Aun asi me aparece a la izquierda en firefox (aun no checo los demas). Pero puedo moverlo con float: right por ejemplo.
  #4 (permalink)  
Antiguo 19/02/2010, 23:42
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.822
Antigüedad: 9 años, 9 meses
Puntos: 951
Respuesta: Centrando mi menu <ul>

Cita:
Iniciado por Carlangueitor Ver Mensaje
Fácil, solo agrega en #topemenu, margin: 0 auto; es la forma en que puedes centrar con CSS.
#topemenu no tiene ancho fijo por lo que no funcionara con margin:0 auto;

yo usaría text-align:center;
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #5 (permalink)  
Antiguo 19/02/2010, 23:45
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 9.968
Antigüedad: 9 años, 8 meses
Puntos: 1314
Respuesta: Centrando mi menu <ul>

Cita:
Iniciado por Ag666 Ver Mensaje
#topemenu no tiene ancho fijo por lo que no funcionara con margin:0 auto;

yo usaría text-align:center;
Cierto, necesita un ancho fijo, y text-align no funcionara con elementos de bloque como el UL.
__________________
Grupo Telegram Docker en Español
  #6 (permalink)  
Antiguo 20/02/2010, 00:16
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 5.822
Antigüedad: 9 años, 9 meses
Puntos: 951
Respuesta: Centrando mi menu <ul>

Cita:
Iniciado por Carlangueitor Ver Mensaje
Cierto, necesita un ancho fijo, y text-align no funcionara con elementos de bloque como el UL.
jeje ok toda la razón como el lo tenia no funciona, así que le propongo cambie su código por este:

Código CSS:
Ver original
  1. /* Top-Menu */
  2. #topmenu{
  3.     color: #FFF;
  4.     background-color: #616D7E;
  5.     height: 50px;
  6.     text-align:center;
  7.     }
  8. #topmenu ul{
  9.     list-style: none;
  10.     }
  11. #topmenu li{
  12.     display:inline;
  13.     margin:0 6px;
  14.     line-height:50px;
  15.     }
  16. #topmenu ul li a {
  17.     color: #FFF;
  18.     font-family: "Trebuchet MS", Helvetica, sans-serif;
  19.     font-size: 18px;
  20.     text-decoration: underline;
  21.     }
__________________
Toda ayuda se proporciona exclusivamente en el foro, no skype, no mensajes privados u otro medio....
  #7 (permalink)  
Antiguo 20/02/2010, 07:07
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 15 años, 5 meses
Puntos: 361
Respuesta: Centrando mi menu <ul>

Hola:

Pon en el inicio de tu css lo siguiente:

Código CSS:
Ver original
  1. * {padding:0; margin:0 auto;}

Saludos.


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 11:29.