elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: AIO elhacker.NET 2021 Compilación herramientas análisis y desinfección malware


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Problema centrar menu vertical desplegable		0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Problema centrar menu vertical desplegable  (Leído 3,442 veces)
Kaxperday


Desconectado Desconectado

Mensajes: 702


The man in the Middle


Ver Perfil WWW
Problema centrar menu vertical desplegable
« en: 28 Febrero 2014, 09:06 am »
CSS:

Código
  1. #columnasupizq{ 
  2. width: 170px;
  3. height: 100%;
  4. margin 0 auto;
  5. float:left;
  6. background-image: url("verde1.jpg");
  7. border-style: outset; border-width: 2px;
  8. margin-right:25px;
  9. }
  10.  
  11. ////////////
  12.  
  13. #menu{
  14. margin-left: auto;
  15. margin-right: auto;
  16. width: 760px;
  17. }
  18. #menu {  
  19. text-align: center;
  20. margin:0 auto;
  21. }
  22. #menu ul { list-style-type: none;
  23. }
  24. #menu ul li.nivel1 { 
  25. width: 155px;
  26. }
  27. #menu ul li.primera { 
  28. border-top: solid 1px #FFF;
  29. }
  30. #menu ul li a {
  31. margin:0 auto;
  32. display: block;
  33. text-decoration: none;
  34. color: #fff;
  35. background-color: #399;
  36. border: solid 1px #fff;
  37. border-top: none;
  38. padding: 8px;
  39. }
  40. #menu ul li:hover{
  41. position: relative;
  42. background-color: #6CC;
  43. color: #000;
  44. }
  45. #menu ul li a:hover, #menu ul li:hover > a.nivel1{
  46. background-color: #6CC;
  47. color: #000;
  48. }
  49. #menu ul li a.nivel1{
  50. display: block!important;
  51. display: none;
  52. }
  53. #menu ul li ul{
  54. display: none;
  55. }
  56. #menu ul li a:hover ul, #menu ul li:hover > ul {
  57. display: block;
  58. top:-1px!important;top: -31px;
  59. }
  60.  
  61.  

CODIGO:

Código
  1. <div id="columnasupizq">
  2.  
  4.  
  5. <br>
  6.  
  7. <div id="boton">
  8. Men&uacute;
  9. </div>
  10.  
  11. <br>
  12.  
  13. <div id="menu" center>
  14. <ul>
  15.   <li class="nivel1 primera"><a href="#" class="nivel1">Ver mi huella digital</a>
  16. 	<ul class="nivel2">
  17. 		<li class="primera"><a href="#">Opción 1.1</a></li>
  18. 	</ul>
  19.   </li>
  20.   <li class="nivel1"><a href="#" class="nivel1">Enviarnos un archivo</a>
  21. 	<ul class="nivel2">
  22. 		<li class="primera"><a href="#" class="nivel1">Opción 2.1</a></li>
  23. 		<li><a href="#">Opción 2.2</a></li>
  24. 		<li><a href="#">Opción 2.3</a></li>
  25. 		<li><a href="#">Opción 2.4</a></li>
  26. 	</ul>
  27. </li>
  28.   <li class="nivel1"><a href="#" class="nivel1">Descargar un archivo</a>
  29. 	<ul class="nivel2">
  30. 		<li class="primera"><a href="#">Opción 3.1</a></li>
  31. 		<li><a href="#">Opción 3.2</a></li>
  32. 	</ul>
  33. </li>
  34.   <li class="nivel1"><a href="#" class="nivel1">Descargar programas</a>
  35. 	<ul class="nivel2">
  36. 		<li class="primera"><a href="#">Opción 4.1</a></li>
  37. 		<li><a href="#">Opción 4.2</a></li>
  38. 		<li><a href="#">Opción 4.3</a></li>
  39. 	</ul>
  40. </li>
  41. </ul>
  42. </div>
  43.  

Llevo más de 2 días intentando centrarlo, y no tengo resultados, ayuda por favor.
« Última modificación: 28 Febrero 2014, 18:25 pm por Kaxperday » En línea
Cuando el poder económico parasita al político ningún partido ni dictador podrá liberarnos de él. Se reserva el 99% ese poder.
engel lex
Moderador Global
***
Desconectado Desconectado

Mensajes: 15.514



Ver Perfil
Re: Problema centrar menu vertical desplegable
« Respuesta #1 en: 28 Febrero 2014, 15:20 pm »
usa as etiquetas GeSHi ubicada a la derecha arriba de los emoticonos para publicar codigo y que sea mas legible... pasa una captura de pantalla de lo que tienes y lo que quieres...
En línea
El problema con la sociedad actualmente radica en que todos creen que tienen el derecho de tener una opinión, y que esa opinión sea validada por todos, cuando lo correcto es que todos tengan derecho a una opinión, siempre y cuando esa opinión pueda ser ignorada, cuestionada, e incluso ser sujeta a burla, particularmente cuando no tiene sentido alguno.
Kaxperday


Desconectado Desconectado

Mensajes: 702


The man in the Middle


Ver Perfil WWW
Re: Problema centrar menu vertical desplegable
« Respuesta #2 en: 28 Febrero 2014, 18:27 pm »
Siento no haber puesto esas etiquetas, no sabía donde estaban.

Respecto a lo de captura de pantalla no hay mucho que decir, puedo describir lo que ocurre perfectamente, es un div vertical con el menú desplegable en su interior, y el problema es que el menu no está centrado y se sale del div un poco por la derecha.

Agradecería muchísimo la ayuda, llevo 3 días bloqueado con esto y no hay manera.
« Última modificación: 28 Febrero 2014, 18:30 pm por Kaxperday » En línea
Cuando el poder económico parasita al político ningún partido ni dictador podrá liberarnos de él. Se reserva el 99% ese poder.
dainodaibouken

Desconectado Desconectado

Mensajes: 39



Ver Perfil
Re: Problema centrar menu vertical desplegable
« Respuesta #3 en: 28 Febrero 2014, 19:15 pm »
para centrar un "div" utiliza esto:

por ejemplo
tienes esto :
Código
  1. #menu{
  2. margin-left: auto;
  3. margin-right: auto;
  4. width: 760px;
  5. }

para centrar ese div has esto :

Código
  1. #menu{
  2. width: 760px;
  3. left:50%;
  4. margin-left:-380px;
  5. }

te preguntaras por que 380 px, se toma de referencia el 'width' y de divide entre 2, el resultado es el que pondras en margin-left.

espero esto te sirva, saludos!
En línea
Kaxperday


Desconectado Desconectado

Mensajes: 702


The man in the Middle


Ver Perfil WWW
Re: Problema centrar menu vertical desplegable
« Respuesta #4 en: 28 Febrero 2014, 19:28 pm »
Cita de: dainodaibouken en 28 Febrero 2014, 19:15 pm
para centrar un "div" utiliza esto:

por ejemplo
tienes esto :
Código
  1. #menu{
  2. margin-left: auto;
  3. margin-right: auto;
  4. width: 760px;
  5. }

para centrar ese div has esto :

Código
  1. #menu{
  2. width: 760px;
  3. left:50%;
  4. margin-left:-380px;
  5. }

te preguntaras por que 380 px, se toma de referencia el 'width' y de divide entre 2, el resultado es el que pondras en margin-left.

espero esto te sirva, saludos!

No me funcionó, el menú sigue descentrado, este es el CSS donde defino al div en cuyo interior quiero centrar el menú:

Código
  1. #columnasupizq{ 
  2. width: 170px;
  3. height: 100%;
  4. margin 0 auto;
  5. float:left;
  6. background-image: url("verde1.jpg");
  7. border-style: outset; border-width: 2px;
  8. margin-right:25px;
  9. }

Es decir tiene un ancho de 170px, lo que hago es abrir este div, y poner dentro en menu con center pero me aparece desplazado a la derecha y queda mitad dentro y mitad fuera. :(
En línea
Cuando el poder económico parasita al político ningún partido ni dictador podrá liberarnos de él. Se reserva el 99% ese poder.
dainodaibouken

Desconectado Desconectado

Mensajes: 39



Ver Perfil
Re: Problema centrar menu vertical desplegable
« Respuesta #5 en: 28 Febrero 2014, 19:42 pm »
te falta aplicar 'position' te recomiendo que uses absolute. y otra cosa es que al div que quieres centrar debe aplicarse lo que te dije por ejemplo tienes el div #columnasupizq y adentro de ese div tienes #menu, entonces tienes que aplicar left y margin-left a #menu acuerdate tambien de la position de #columnasupizq que sea absolute.

Código
  1. #columnasupizq{ 
  2. position:absolute;
  3. width: 170px;
  4. height: 100%;
  5. margin 0 auto;
  6. float:left;
  7. background-image: url("verde1.jpg");
  8. border-style: outset; border-width: 2px;
  9. margin-right:25px;
  10. }

Código
  1. #menu{
  2. position:absolute;
  3. width: 760px;
  4. left:50%;
  5. margin-left:-380px;
  6. }

Saludos!
En línea
Kaxperday


Desconectado Desconectado

Mensajes: 702


The man in the Middle


Ver Perfil WWW
Re: Problema centrar menu vertical desplegable
« Respuesta #6 en: 28 Febrero 2014, 20:22 pm »
Lo siento pero sigo sin tener resultados, me desplazo todos los demás div a la derecha, menos el menú que no cambio su posición ni el div superior izquierdo, agradezco tu ayuda quizás me lo consigas arreglar, yo estuve discurriendo 2 días y nada, no conseguí mover el dichoso menú.

Y aún sigo bloqueado, de todas formas gracias por tu ayuda dainodaibouken :/
En línea
Cuando el poder económico parasita al político ningún partido ni dictador podrá liberarnos de él. Se reserva el 99% ese poder.
Kaxperday


Desconectado Desconectado

Mensajes: 702


The man in the Middle


Ver Perfil WWW
Re: Problema centrar menu vertical desplegable
« Respuesta #7 en: 28 Febrero 2014, 20:41 pm »
OOOOOOOOOOOOOOHHHHHHHHHHHHHHHHHHHHHHJJJJJJJJJJJ

POR FINN!!!! LO CONSEGUÍÍÍ!!!! Fue un orgasmo cerebral ver como encajaba el menú dentro del div unos 300 intentos y resultados negativos.

Al final la clave estuvo en el margin-left:-20px;

Código
  1. #menu {  text-align: center;
  2. width: 760px;
  3. margin-left:-20px;
  4. }

Puedo incluso quitar eso de width, gracias por tu ayuda, aunque no me lo solucionaste directamente, me hicistes probar cosas nuevas e intentarlo una y otra vez de nuevo, gracias.
En línea
Cuando el poder económico parasita al político ningún partido ni dictador podrá liberarnos de él. Se reserva el 99% ese poder.
dainodaibouken

Desconectado Desconectado

Mensajes: 39



Ver Perfil
Re: Problema centrar menu vertical desplegable
« Respuesta #8 en: 28 Febrero 2014, 20:55 pm »
oye pero ahi no estas centrando xD, puede que en tu monitor se vea bien, pero si lo ves en algun otro monitor con diferente resolucion seguro se va a descuadrar y se vera mal todo D:!

pero que bien que ya te quedo ^____^~~

Saludos.
En línea
Kaxperday


Desconectado Desconectado

Mensajes: 702


The man in the Middle


Ver Perfil WWW
Re: Problema centrar menu vertical desplegable
« Respuesta #9 en: 28 Febrero 2014, 21:23 pm »
jajaja no lo había pensado pero GRACIAS por recordarmelo xD

Da igual, de momento lo voy a dejar aparcado un buen tiempo, antes tomo las medidas de la pantalla  y resto lo que haga falta que volver a intentar centrar eso xD
En línea
Cuando el poder económico parasita al político ningún partido ni dictador podrá liberarnos de él. Se reserva el 99% ese poder.
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
menu vertical flashmx
Diseño Gráfico 		juanfatchivo 3 2,552 Último mensaje 31 Enero 2006, 09:35 am
por juanfatchivo
Problemas con Menu Vertical
Programación Visual Basic 		ssccaann43 © 0 1,074 Último mensaje 4 Septiembre 2008, 18:59 pm
por ssccaann43 ©
problema en firefox con menú desplegable
Desarrollo Web 		Gupita 3 3,293 Último mensaje 4 Noviembre 2010, 22:01 pm
por Kasi
MOVIDO: problema en firefox con menú desplegable
Java 		Leyer 0 1,602 Último mensaje 2 Noviembre 2010, 20:10 pm
por Leyer
Panel Vertical/Horizontal desplegable con jQuery
PHP 		Shell Root 2 6,868 Último mensaje 20 Febrero 2012, 23:18 pm
por Shell Root
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines