Cómo centrar imágenes en una página web para todos los tamaños de pantalla

Tengo un problema con mi código HTML. He buscado en Internet, pero aún no hay una respuesta real.Cómo centrar imágenes en una página web para todos los tamaños de pantalla

Tengo un sitio web con algunas imágenes, y quiero que estén en el medio. Ahora, en mi pantalla están en el medio, pero eso es porque los puse allí moviéndolos a un lado. Cuando mis amigos lo miran, la imagen está descentrada.

Here's the website; Si usted está en una pantalla de 13.5" que se verá a estar en el medio

Fuente

2011-05-05 connor.p

votación para mover a los webmasters Stackexchange sitio ya que es un partido mejor para esta pregunta – bdonlan

bdonlan votó a favor de haber trasladado su pregunta; no es necesario que vayas a los webmasters a menos que la pregunta realmente se mueva. La pregunta se redirigirá automáticamente. @bdonlan este es un problema de CSS específico, no un problema para el webmaster. debería quedarse aquí. –

@bdonlan - Definitivamente no * es * una pregunta de Webmasters. Las preguntas HTML y CSS pertenecen a SO. – Dori

¿no sería aceptable el uso de una simple etiqueta <center></center>?

Me falta algo aquí si no. Siéntase libre de explicar por qué en un comentario. Me encanta el diseño web y su sitio es muy impresionante. Podría sugerir que se haga algo para reducir el tiempo de carga, eso es un poco apagado.

-De uno a otro MC ventilador :)

EDITAR

Me tomó un vistazo a su código ... ay!

<center></center> 

<center><body onload="MM_preloadImages('../logo-glow.png')"> 
<a href="homepage.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('minecraft2','','../logo-glow.png',1)"><img src="../log-noglow.png" name="minecraft2" width="998" height="222" hspace="0" border="0" align="absmiddle" id="minecraft2" /></a></body></center>

Trate de no colocar las etiquetas de formato fuera del cuerpo. Coloque el <center> dentro de la etiqueta del cuerpo. Funciona porque sigue las reglas estrictas de bajo nivel de HTML, sin embargo, no todos los navegadores son tan agradables y algunos pueden mostrar su página incorrectamente a menos que se solucione este problema.

Fuente

2011-05-05 17:45:49 FreeSnow

Sure '

' funciona , pero no es un HTML5 válido, que se convertirá en un problema a medida que los navegadores eliminen las etiquetas más antiguas y obsoletas. –

Realmente, ha sido desaprobado? Guau. ¿Es posible centrar mediante otro método mientras solo se utiliza el código HTML vainilla (sin CSS o JavaScript)? – FreeSnow

Sin CSS? no. apesta. Me encanta '

' –

Pruebe algo como esto ...

<div id="wrapper" style="width:100%; text-align:center"> 
<img id="yourimage"/> 
</div>

Fuente

2011-05-05 17:34:33

@ connor.p np. No te olvides de marcar la publicación que más ayuda como respuesta. –

+1 para el ejemplo generalizado, y, para ser justos, estoy usando casi la misma solución (excepto que confío en el comportamiento predeterminado de 'display: block;'). @ connor.p, como señala Thomas, acepte la respuesta más útil (si su problema está resuelto) y, si cree que las demás respuestas fueron útiles, considere votar también por ellas ... :) –

En su caso específico, se puede establecer el elemento que contiene a ser.:

a { 
    display: block; 
    text-align: center; 
}

JS Bin demo.

Fuente

2011-05-05 17:42:21

<div style='width:200px;margin:0 auto;> sometext or image tag</div>

esto funciona horizontalmente

Fuente

2012-11-14 13:52:39 user1468562

Cómo centrar imágenes en una página web para todos los tamaños de pantalla

Respuesta

Cuestiones relacionadas