Sign up with your email address to be the first to know about new products, VIP offers, blog features & more.

Alinear imágenes correctamente en una grilla sin usar tablas con HTML y CSS

Es bien posible que en más de una ocasión hayáis tenido que colocar imágenes una detrás de otra formando filas y columnas. Algo como lo que muestro a continuación:

Grilla de imágenes

¿Cuál es el problema? Si lo hacéis a mano directamente con HTML y CSS sin usar una galería o un framework que te la cree correctamente, os habréis peleado para dejarlas perfectamente alineadas.

Personalmente he probado de todo, desde obligar a alturas, márgenes, padding, float, etc. a incluir más div y nada, hasta que leí esta pregunta del genial Stackoverflow.

¿Qué estructura tenemos que seguir para llegar a esta solución?

El siguiente HTML:

Y el siguiente CSS (traduzco los comentarios):

Leer entrada anterior
Cambiar tema de Spotify en Ubuntu

Quizás la mayor parte de nuestros lectores no sean usuarios de Spotify, pero si bien es cierto que se trata...

Cerrar