Foros del Web » Creando para Internet » CSS »

Centrar imagen, Media Queries

Estas en el tema de Centrar imagen, Media Queries en el foro de CSS en Foros del Web. Buenas, Mi ultimo descubrimiento ha sido media queries y es fantástico poder adaptar la web a cada resolución. Estoy utilizando un plugin jquery para una ...
  #1 (permalink)  
Antiguo 18/12/2011, 10:18
 
Fecha de Ingreso: febrero-2010
Mensajes: 49
Antigüedad: 14 años, 10 meses
Puntos: 0
Centrar imagen, Media Queries

Buenas,
Mi ultimo descubrimiento ha sido media queries y es fantástico poder adaptar la web a cada resolución.

Estoy utilizando un plugin jquery para una galería http://buildinternet.com/project/supersized/

El único problema que encuentro es que quiero asignarle un tamaño máximo a las imágenes. Ya que este plugin renderiza las imágenes a cada resolución. Y si le pongo un tamaño máximo, no consigo centrar la imagen.

El código CSS es este:

Código:
* { margin:0; padding:0; }
body { background:#111; height:100%; }
	img { border:none; }
	
	#supersized-loader { position:absolute; top:50%; left:50%; z-index:0; width:60px; height:60px; margin:-30px 0 0 -30px; text-indent:-999em; background:url(../img/progress.gif) no-repeat center center;}
	
	#supersized {  display:block; position:fixed; left:0; top:0; overflow:hidden; z-index:-999; height:100%; width:100%; }
		#supersized img { width:auto; height:auto; position:relative; display:none; outline:none; border:none; }
			#supersized.speed img { -ms-interpolation-mode:nearest-neighbor; image-rendering: -moz-crisp-edges; }	/*Speed*/
			#supersized.quality img { -ms-interpolation-mode:bicubic; image-rendering: optimizeQuality; }			/*Quality*/
		
		#supersized li { display:block; list-style:none; z-index:-30; position:fixed; overflow:hidden; top:0; left:0; width:100%; height:100%; background:#111; }
		#supersized a { width:100%; height:100%; display:block; }
			#supersized li.prevslide { z-index:-20; }
			#supersized li.activeslide { z-index:-10; }
			#supersized li.image-loading { background:#111 url(../img/progress.gif) no-repeat center center; width:100%; height:100%; }
				#supersized li.image-loading img{ visibility:hidden; }
			#supersized li.prevslide img, #supersized li.activeslide img{ display:inline; }
Aquí hay alguien más con el mismo problema e intenta darle solución.
http://stackoverflow.com/questions/6...ax-constraints

Un saludo!

Etiquetas: media, queries, tamaño, fondo
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:45.