Página Principal Menú Charkleons Radio Online Facebook - Charkleons.com YouTube - Charkleons.com Twitter - Charkleons.com

Cómo centrar una imagen en una columna

Centrar una imagen en una columna - Charkleons.com

Es algo muy fácil, y el problema la mayoría de veces radica en que tomamos la imagen centrada de una entrada, y la pasamos tal cual a una columna usando el gadget habitual de HTML / Javascript, pero, la imagen de la entrada trae unos códigos que hace que no quede centrada, y son los que debemos quitar; así de fácil. 

Ejemplo de una imagen centrada en una entrada:

<div class="separator" style="clear: both; text-align: center;">
<a href="URL que redirecciona o de la imagen" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" r6="true" src="URL de la imagen" /></a></div>

Quiten de sus códigos lo que está en color rojo y listo; su imagen se verá centrada en las columnas.

Si a nuestra imagen en la entrada le definimos un tamaño, saldrá el width="***" y el height="***" en alguna parte del código; pero esto no afecta para nada que la imagen quede centrada; a menos claro está, que la imagen sea más ancha que la columna. Recuerden que pueden dejar solo la medida del ancho -width- y los navegadores aplican automáticamente el height.

Otra opción que se usaba antes, y que tal vez en algún caso les pueda servir, sería agregar las etiquetas de <center> </center> Ésta opción es muy fácil y casi siempre funciona.

Espero que esta información les sea muy útil.

Gracias.

4 comentarios:

  1. Una pregunta. Como Poner entradas relacionadas debajo de una entrada

    ResponderEliminar
  2. Hola, gracias por comentar. Disculpa por favor la demora en la respuesta. No cuento con un tema que explique lo que comentas, lo haré próximamente. Mientras tanto puedes hacerlo a través de la página Addthis, creas una cuenta, y en la pestaña tools, eliges Related Posts, ellos te van a pasar dos códigos, ambos los puedes colocar en un gadget HTML-Javascript y lo colocas debajo del cuadro de la entrada en Diseño. Si no te pasan los códigos los puedes obtener haciendo clic sobre la pestaña «Get the code» en la parte superior derecha. Otra forma más clásica sería como muestran en las siguientes páginas: https://petersonmar.blogspot.com/2015/11/entradas-relacionadas-en-miniatura.html o https://internetrcc.com/2015/08/como-incluir-widget-posts-relacionados-blogger/ Disculpa que no te pueda colaborar de una mejor manera. Saludos.

    ResponderEliminar
  3. Viendo un articulo en un blog (anteriormente de preguntarle a ti), y por la información que encontré,fue que implemente en una plantilla de uno de mis blog,lo que habia averiguado; pero me quedaron hacia la izquierda. http://publicatucarta.blogspot.com/2017/08/votar-cristina-fernandez-es-volver-al.html
    Disculpa pero para esto soy bastante ignorante. Si tienes tiempo, y un correo electronico, quisiera hacerte otras preguntas.Gracias por tu atención.

    ResponderEliminar
    Respuestas
    1. Hola. En la parte donde hayas colocado el código agrega las etiquetas de center al inicio y al final, como se muestra en el último párrafo de este tema, no las puedo mostrar en este mensaje porque blogger las toma como html y no deja publicar la respuesta. Lo más probable es que con esto el gadget quede centrado. A través de los mensajes de la página de facebook te puedes poner en contacto conmigo, y en lo que pueda trataré de colaborarte. Saludos.

      Eliminar

Gracias por comentar.