Foros del Web » Programando para Internet » Javascript »

Centrar un div en el medio de la pantalla

Estas en el tema de Centrar un div en el medio de la pantalla en el foro de Javascript en Foros del Web. hola, mi problema es el siguiente. tengo un div con los siguientes estilos css. Código: position:fixed; left:50%; top:50%; margin-left:-300px; margin-top:-200px; background-color:transparent; z-index:4; y eso centra ...
  #1 (permalink)  
Antiguo 14/02/2012, 05:06
Avatar de intiweb  
Fecha de Ingreso: mayo-2009
Ubicación: Capital Federal
Mensajes: 363
Antigüedad: 15 años, 6 meses
Puntos: 5
Centrar un div en el medio de la pantalla

hola, mi problema es el siguiente.
tengo un div con los siguientes estilos css.

Código:
        position:fixed;
	left:50%;
	top:50%;
	margin-left:-300px;
	margin-top:-200px;
	background-color:transparent;
	z-index:4;
y eso centra al medio el div ya que mide 600 de ancho y 400 de alto. pero el problema es que en ese div tengo una foto y 2 botones next y prev para ir pasando las fotos y las va pasando con javascript. pero no todas las fotos tienen el mismo ancho. la altura la fuerzo pero dejo el ancho libre para las diferentes fotos. entonces lo que pasa es que la primer foto esta centrada pero las demas fotos si son mas angostas o mas anchas se modifican del lado derecho pero no del lado izquierdo, o sea la distancia entre la foto y el margen izquierdo del monitor es siempre la misma lo que cambia es la distancia entre la foto y el margen derecho del monitor.

no se si existe la manera de saber con javascript el largo que tendra la foto cuando tenga 400px de altura y asi modificar el estilo con javascript para modificar el margin-left, o si existe una manera mas elegante como un align center.
lo puse en el foro de javascript porque me parecio correcto pero capas la solucion este en el estilo css.
__________________
un saludo..... . . .
  #2 (permalink)  
Antiguo 14/02/2012, 05:32
Avatar de Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.148
Antigüedad: 20 años, 5 meses
Puntos: 834
Respuesta: Centrar un div en el medio de la pantalla

Por qué no colocar a la capa un width del 100%, un left de 0,un margin-left de 0 y colocar la imagen como background -en lugar de background-color:transparent, background:url(urlImagen) center 0 no-repeat-
  #3 (permalink)  
Antiguo 15/02/2012, 04:18
Avatar de intiweb  
Fecha de Ingreso: mayo-2009
Ubicación: Capital Federal
Mensajes: 363
Antigüedad: 15 años, 6 meses
Puntos: 5
Respuesta: Centrar un div en el medio de la pantalla

eso seria un problema para los botones next y prev. como harias para que los botones se vieran al costado de la foto :S
o capas no entendi bien la idea. (vos me decis de hacer un capa que ocupe toda la pantalla y poner como background la foto centrada sin repetir) pero igual eso no me permitiria agustar donde deben estar los botones.
__________________
un saludo..... . . .
  #4 (permalink)  
Antiguo 15/02/2012, 09:57
 
Fecha de Ingreso: febrero-2012
Mensajes: 9
Antigüedad: 12 años, 9 meses
Puntos: 0
Respuesta: Centrar un div en el medio de la pantalla

Yo probaría en dejar el centro automático. Me explico:

Al div que contiene la foto le indicas margin-left y margin-right como auto.

Y al padre de este div, le indicas un text-align: center.

Es la manera de centrar un objeto standard para cualquier browser, y de forma independiente al ancho del contenido.

Espero haberte ayudado. :)
  #5 (permalink)  
Antiguo 15/02/2012, 17:14
Avatar de intiweb  
Fecha de Ingreso: mayo-2009
Ubicación: Capital Federal
Mensajes: 363
Antigüedad: 15 años, 6 meses
Puntos: 5
Respuesta: Centrar un div en el medio de la pantalla

gracias,. lo voy a probar y comentare como me fue !!
__________________
un saludo..... . . .
  #6 (permalink)  
Antiguo 17/02/2012, 03:02
Avatar de intiweb  
Fecha de Ingreso: mayo-2009
Ubicación: Capital Federal
Mensajes: 363
Antigüedad: 15 años, 6 meses
Puntos: 5
Respuesta: Centrar un div en el medio de la pantalla

woo. que facil que era la respuesta :S jaja
muchas gracias !!
__________________
un saludo..... . . .

Etiquetas: medio, pantalla, botones
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 01:30.