Cómo alinear verticalmente una imagen respecto a su contenedor

Antes de CSS3 no existía ninguna propiedad donde explícitamente indicáramos alineación vertical para el contenido de un contenedor. Se podía conseguir combinando una serie de propiedades utilizando css, vamos a repasar algunas de la posibilidades que teníamos para alinear una imagen verticalment respecto a su contenedor antes de CSS3 y como hacerlo con CSS3.

HTML and CSS: Design and Build Websites [Tapa Dura] de Jon Duckett

Ya había excrito un post sobre HTML and CSS: Design and Build Websites de Jon Duckett, pero en esta ocasión quiero compartir una experiencia más personal en la decisión de comprar este libro en formato tapa dura, por qué decidí comprar este formato ,el proceso que seguí  y por qué lo compré en Amazon.com y no en Amazon.es.

HTML and CSS: Design and Build Websites de Jon Duckett (@htmlandcssbook)

HTML and CSS: Design and Build Websites es un libro muy recomendado para aquellas personas que se quieran adentrar en el mundo web.

Es un libro que desde el principio te das cuenta que tiene un enfoque distinto de lo habitual, lo común en los libros de informática es que su diseño parezca un manual de instrucciones en blanco y negro, sin embargo este libro tiene muy cuidado su diseño, es en color, los ejemplos son muy claros y muy visuales lo que hace la lectura del libro muy agradable.

Margin Collapsing en CSS

Margin Collapsing en css es un efecto que se produce cuando el margen vertical de dos elementos se tocan, como consecuencia se fusionan en uno solo y pasa a formar parte de uno de los elementos, dejando el otro sin margen. El tamaño del margen colapsado se corresponderá con el de mayor tamaño.
Este comportamiento es bueno para texto como párrafos, títulos pero hay otras circunstancias donde no será el resultado esperado.
Margin Collapsing no se producirá cuando existan elementos con borde,flotantes, con padding, con posición absoluta, inline-block, con overflow diferente de visible.
Vamos a ver unos ejemplos donde se produce.

Como Alinear 3 Div a la izquierda centro y derecha

Este blog no esta mantenido, suscribite a la newsletter del nuevo

En ocaciones en html tenemos la necesidad de organizar el contenido de un contenedor a la derecha , izquierda y centro. Por ejemplo en un header podemos querer un logo a la izquierda, menú en centro y caja de búsqueda a la derecha.

Vamos a ver un ejemplo.