Alineamiento de una imagen con CSS

En un proyecto importante en el que estoy trabajando tenemos que añadir una serie de nuevas funcionalidades a una aplicación muy grande y eso supone también modificar la web que visitan cientos de miles de personas al día. Al ver que mis compañeros de HTML están más bien peladitos me ofrecí voluntario para hacerla ya que daban libertad dentro de unos limites.

Al apañar la web para las nuevas características me encuentro con que esta hecha con el diseñador de webforms de Visual Studio, y me encuentro con cosas como align="absBottom" en una imagen para centrarla verticalmente.

Como aparte de las modificaciones que debía de hacer y como me sobraba tiempo y me aburría, convertí la web de formato indefinido a XHTML correcto con CSS, tenia que arreglar ese tipo de cosas, así que el alineamiento de la imagen se puede hacer con CSS con el estilo vertical-align que tomaría los siguientes valores

  • top
  • left
  • right
  • middle
  • bottom

El código seria este:

  <img src="..." align="absBottom">

El nuevo código sería:

  <img src="..." class="middle" title="...."
 alt="...." />

Y la clase CSS seria:

  .middle {
    vertical-align: middle;
    /* Valores: top, left, right, middle, bottom */
  }

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *