Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] ConsultA alineacion componentes en menu.

Estas en el tema de ConsultA alineacion componentes en menu. en el foro de CSS en Foros del Web. buenas gente, estoy tratando de alinear un menu, mejor dicho que los links queden centrados pero solo me quedan alienados a la izquierda... como puedo ...
  #1 (permalink)  
Antiguo 01/09/2014, 10:00
Avatar de ignacio85r  
Fecha de Ingreso: mayo-2010
Ubicación: mar del plata
Mensajes: 155
Antigüedad: 12 años, 2 meses
Puntos: 0
Pregunta ConsultA alineacion componentes en menu.

buenas gente, estoy tratando de alinear un menu, mejor dicho que los links queden centrados pero solo me quedan alienados a la izquierda... como puedo solucionarlo????

aqui esta el codigo ccs y luego el html.

desde ya muchas gracias!



Código HTML:
Ver original
  1. <nav>
  2.         <ul>
  3.             <li><a href="http://">Menu 1</a></li>
  4.             <li><a href="http://">Menu 2</a></li>
  5.             <li><a href="http://">Menu 3</a></li>
  6.             <li><a href="http://">Menu 4</a></li>
  7.         </ul>
Código CSS:
Ver original
  1. *{
  2.     margin: 0px 0px;
  3.     padding: 0px 0px;
  4. }
  5.  
  6. body {
  7.     background-color: #00cccc;
  8. }
  9.  
  10. header {
  11.     background-color: #00ffcc;
  12.     text-align: center;;
  13. }
  14.  
  15. nav {
  16.     margin: 0px auto;
  17.     width: 75%;
  18. }
  19.  
  20. nav ul {
  21.     background-color: #0099cc;
  22. }
  23.  
  24. nav ul li {
  25.     color: #00ffcc;
  26.     display: inline-block;
  27.     list-style: none;
  28.     margin: 0px auto;
  29.     padding: 0px auto;
  30.     text-decoration: none;
  31.     width: 20%;
  32. }
  33.  
  34. nav ul li a {
  35.     display: inline-block;
  36.     text-align: center;
  37. }
  38.  
  39. section {
  40.     background-color: #0066cc;
  41.     max-width: 100%;
  42.     padding: 0px 0px;
  43. }
  44.  
  45. article {
  46.     background-color: #0033cc;
  47.     display: inline-block;
  48.     height: 200px;
  49.     margin: 0px 0px;
  50.     text-align: justify;
  51.     vertical-align: top;
  52.     width: 33.1%;
  53. }

__________________
Los manuales existen por un motivo... explicar el funcionamiento de algo. ;-)

Última edición por ignacio85r; 01/09/2014 a las 13:41 Razón: Correcciones
  #2 (permalink)  
Antiguo 01/09/2014, 22:04
 
Fecha de Ingreso: julio-2014
Mensajes: 179
Antigüedad: 8 años
Puntos: 26
Respuesta: ConsultA alineacion componentes en menu.

Yo lo veo bien, velo en otro navegador o ve si tienes en tu código la etiqueta <!doctype html>

Tienes algunos detalles en tus hojas de estilos:
Código CSS:
Ver original
  1. header {
  2.     background-color: #00ffcc;
  3.     text-align: center;; /*doble punto y coma*/
  4. }

text-decoration:none; va en nav ul li a, quedando así
Código CSS:
Ver original
  1. nav ul li {
  2.     color: #00ffcc;
  3.     display: inline-block;
  4.     list-style: none;
  5.     margin: 0px auto;
  6.     padding: 0px auto;
  7.     width: 20%;
  8. }
  9. nav ul li a {
  10.     display: inline-block;
  11.     text-align: center;
  12.     text-decoration: none;
  13. }

Y preguntate por que razón estas incluyendo las etiquetas <ul> y <li>... si te interesa trate un poco del tema en mi sitio :http://mecanizandoweb.com/noticias/nav-retando-las-tendencias-web

Saludos
__________________
Si haces las cosas como nadie las ha hecho, cobralas bien, si las vas a hacer como todos las han hecho, cobralas bien!!
MecanizandoWeb.com
  #3 (permalink)  
Antiguo 02/09/2014, 05:48
Avatar de ignacio85r  
Fecha de Ingreso: mayo-2010
Ubicación: mar del plata
Mensajes: 155
Antigüedad: 12 años, 2 meses
Puntos: 0
Respuesta: ConsultA alineacion componentes en menu.

desde ya muchas gracias DesgraciadoGabo por tu ayuda.
ahora... en que navegador lo ves centrado¿??? yo probe en el chrome, mozilla y el benevolo explorer y se ve entodos igual.

tambien esa la etiqueta en el html <!DOCTYPE html>

ahora me voy a pegar una leida al articulo de tu pagina ;)
__________________
Los manuales existen por un motivo... explicar el funcionamiento de algo. ;-)
  #4 (permalink)  
Antiguo 02/09/2014, 09:38
 
Fecha de Ingreso: julio-2014
Mensajes: 179
Antigüedad: 8 años
Puntos: 26
Respuesta: ConsultA alineacion componentes en menu.

Gracias por la vuelta en mi sitio, espero te ayude!

Y disculpa por no darte ese dato como se me pudo haber pasado!! Lo probé en Mozilla, Chrome y Safari

Sigues viendo los textos recargados del lado izquierdo?

Saludos
__________________
Si haces las cosas como nadie las ha hecho, cobralas bien, si las vas a hacer como todos las han hecho, cobralas bien!!
MecanizandoWeb.com
  #5 (permalink)  
Antiguo 02/09/2014, 10:59
Avatar de ignacio85r  
Fecha de Ingreso: mayo-2010
Ubicación: mar del plata
Mensajes: 155
Antigüedad: 12 años, 2 meses
Puntos: 0
Respuesta: ConsultA alineacion componentes en menu.

si, la verdad que siguen saliendo del lado izquierdo que raro no?
__________________
Los manuales existen por un motivo... explicar el funcionamiento de algo. ;-)
  #6 (permalink)  
Antiguo 02/09/2014, 11:49
 
Fecha de Ingreso: julio-2014
Mensajes: 179
Antigüedad: 8 años
Puntos: 26
Respuesta: ConsultA alineacion componentes en menu.

Chaleee!!! ja sube tu código (jsfiddle.net, algun alojamiento) pa poder verlo y darle fuego a este asunto que sí esta bien raro!!
__________________
Si haces las cosas como nadie las ha hecho, cobralas bien, si las vas a hacer como todos las han hecho, cobralas bien!!
MecanizandoWeb.com
  #7 (permalink)  
Antiguo 03/09/2014, 05:26
Avatar de ignacio85r  
Fecha de Ingreso: mayo-2010
Ubicación: mar del plata
Mensajes: 155
Antigüedad: 12 años, 2 meses
Puntos: 0
Respuesta: ConsultA alineacion componentes en menu.

aca dejo el link al codigo

http://jsfiddle.net/ignacio85r/tnv0xsjz/
__________________
Los manuales existen por un motivo... explicar el funcionamiento de algo. ;-)
  #8 (permalink)  
Antiguo 04/09/2014, 10:54
 
Fecha de Ingreso: julio-2014
Mensajes: 179
Antigüedad: 8 años
Puntos: 26
Respuesta: ConsultA alineacion componentes en menu.

Que tal ignacio, viendo tu codigo si es algo muy extraño que se valla al lado izquierdo.

Lo que vi es que editaste tu html y el menú quedó más limpio, por esta razón me fue mucho más fácil trabajar un poco en tu problema.

Aquí te dejo la liga del resultado de tu menú:
http://jsfiddle.net/tnv0xsjz/1/

Ahí podrás ver los css y al html no le movi nada, cualquier duda o problema que tengas con gusto lo aclaramos, te mando un saludo brother!!!
__________________
Si haces las cosas como nadie las ha hecho, cobralas bien, si las vas a hacer como todos las han hecho, cobralas bien!!
MecanizandoWeb.com
  #9 (permalink)  
Antiguo 04/09/2014, 11:08
Avatar de ignacio85r  
Fecha de Ingreso: mayo-2010
Ubicación: mar del plata
Mensajes: 155
Antigüedad: 12 años, 2 meses
Puntos: 0
Respuesta: ConsultA alineacion componentes en menu.

ahi vi. creo que era algo de las proporciones que corregi, y quite parametros qe estaban de mas en algunas instrucciones como en el nav y en el nav a.

desde ya muchisimas gracias por tu ayuda DesgraciadoGabo.

saludos para ti tambien :D
__________________
Los manuales existen por un motivo... explicar el funcionamiento de algo. ;-)
  #10 (permalink)  
Antiguo 04/09/2014, 11:32
 
Fecha de Ingreso: julio-2014
Mensajes: 179
Antigüedad: 8 años
Puntos: 26
Respuesta: ConsultA alineacion componentes en menu.

Estamos para ayudar Ignacio :)
__________________
Si haces las cosas como nadie las ha hecho, cobralas bien, si las vas a hacer como todos las han hecho, cobralas bien!!
MecanizandoWeb.com

Etiquetas: alineacion, background, color, componentes, html, width
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 14:16.