Foros del Web » Creando para Internet » Diseño web »

[SOLUCIONADO] barra de menu pierdo ultima opcion

Estas en el tema de barra de menu pierdo ultima opcion en el foro de Diseño web en Foros del Web. Hola, tengo una pagina que el menu se ve perfecto mientras el navegador este al 100% de zoom. Pero al cambiar el zoom la ultima ...
  #1 (permalink)  
Antiguo 26/04/2014, 17:44
Avatar de edurocc  
Fecha de Ingreso: julio-2013
Mensajes: 103
Antigüedad: 10 años, 9 meses
Puntos: 1
Pregunta barra de menu pierdo ultima opcion

Hola, tengo una pagina que el menu se ve perfecto mientras el navegador este al 100% de zoom. Pero al cambiar el zoom la ultima opcion se pierde, se va abajo de la primera opcion.
En una pagina tengo tres opciones en el menu, y al cambiar el zoom la nro.3 se va debajo de la nro.1
En otra pagina tengo cuatro opciones, en el menu, y al cambiar el zoom, la nro.4 se va debajo de la nro.1
En pantallas mas pequeñas como en mi celu tambien me lo hace.

Porque me hace eso?
  #2 (permalink)  
Antiguo 26/04/2014, 20:22
 
Fecha de Ingreso: abril-2014
Mensajes: 12
Antigüedad: 10 años
Puntos: 0
Respuesta: barra de menu pierdo ultima opcion

puedes subir el codigo o la pagina a internet para poder ver el problema?
  #3 (permalink)  
Antiguo 26/04/2014, 21:22
Avatar de edurocc  
Fecha de Ingreso: julio-2013
Mensajes: 103
Antigüedad: 10 años, 9 meses
Puntos: 1
Respuesta: barra de menu pierdo ultima opcion

Gracias por responder Gerrer0 www.dulcetere.com.ar
aqui va el codigo

css:
#menu_{
position:absolute;
left:0px;
top:235px;
width: 709px;
}
#menu_ ul{
position: absolute;
left:3px;
top:-13px;
margin:0 0 0 50;
width: 382px;
}
#menu_ li{
float:left;
top:135px;
}

#menu_ li:hover a {
color:#FF0000;
}
#menu_ a{
position: relative;
display: block;
height: 10px;
padding: 0px 25px 0px 25px;
text-decoration: none;
text-align: center;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
font-size: 17px;
font-weight: bold;
color: #CCC;
border: none;
}
#youtube_ {
position:absolute;
left:739px;
top:235px;
padding:0 0 0 0;
}
#facebook_ {
position:absolute;
left:790px;
top:235px;
padding:0 0 0 0;
}

html:
<div id="menu_">
<img src="imágenes/menu.gif" />
<ul>
<li style="display: inline"><a style="color:#CC9900">Inicio</a></li>
<li style="display: inline"><a href="www/servicio.html">Servicios</a></li>
<li style="display: inline"><a target="_blank" href="www/cf_ajax/index.html">Contacto</a></li>
</ul>

</div>

<div id="youtube_">
<img src="imágenes/youtube.gif" />
</div>

<div id="facebook_">
<a target="_blank" href="###"><img src="imágenes/facebook.gif" /></a>
</div>

El ancho total de la pagina es de 900px

Última edición por edurocc; 26/04/2014 a las 21:24 Razón: dato faltante
  #4 (permalink)  
Antiguo 27/04/2014, 07:46
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 9 meses
Puntos: 2114
Respuesta: barra de menu pierdo ultima opcion

La solución es no usar posicionamiento absoluto.
  #5 (permalink)  
Antiguo 27/04/2014, 15:30
 
Fecha de Ingreso: abril-2014
Mensajes: 12
Antigüedad: 10 años
Puntos: 0
Respuesta: barra de menu pierdo ultima opcion

neee...aunque igual valor absolute no debiste utilizar para este tipo de menu si quieres puedo hacerte uno igual y mandártelo mas compacto y sin mucho enredo xd pero si quieres conservar este menu solo aplicale mas medida al ul en este caso y listo, aveces pasa por que queda sin ancho cuando achicas la pantalla y pasa hacia abajo la div

remplaza esto:
#menu_ ul{
position: absolute;
left:3px;
top:-13px;
margin:0 0 0 50;
width: 500px;
}

lo probé y funciona para todas las resoluciones pero prueba en tu web aver que tal
  #6 (permalink)  
Antiguo 29/04/2014, 20:02
Avatar de edurocc  
Fecha de Ingreso: julio-2013
Mensajes: 103
Antigüedad: 10 años, 9 meses
Puntos: 1
Respuesta: barra de menu pierdo ultima opcion

Cita:
Iniciado por Gerrer0 Ver Mensaje
neee...aunque igual valor absolute no debiste utilizar para este tipo de menu si quieres puedo hacerte uno igual y mandártelo mas compacto y sin mucho enredo xd pero si quieres conservar este menu solo aplicale mas medida al ul en este caso y listo, aveces pasa por que queda sin ancho cuando achicas la pantalla y pasa hacia abajo la div

remplaza esto:
#menu_ ul{
position: absolute;
left:3px;
top:-13px;
margin:0 0 0 50;
width: 500px;
}

lo probé y funciona para todas las resoluciones pero prueba en tu web aver que tal
Si bien es cierto que no hay que usar absolute como dice "pzin", tu solucion funciona muy bien.
Gracias por la ayuda.

Etiquetas: barra, opcion, pierdo
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 00:28.