Varios DIV autoajustables al redimensionar ventana

[minombreesmm]

Iniciado por pubo68

Hola,
en primer lugar presentarme, ya que soy totalmente nuevo en este foro . Salud!

Veréis, estoy tratando de poner bloques div con una imagen dentro, en forma de 4 columnas, y que queden todos alineados en una misma fila.
Me gustaría que al redimensionar la pantalla, los bloques se reordenen en filas de 3 columnas, luego 2 y al final en 1 sola columna, dependiendo del tamaño de la pantalla.

He intentado ponerlos unos tras de otros <div></div><div></div> con la propiedad float:left, pero no da resultado.
¿se os ocurre cómo podría hacer esto?

Sería algo como:


Muchas gracias!

Código CSS:

#cadadiv{
display:inline;
}
 

Código HTML:

<div id="cadadiv"><img src="rutaimagen"/></div>
<div id="cadadiv"><img src="rutaimagen"/></div>
<div id="cadadiv"><img src="rutaimagen"/></div>
<div id="cadadiv"><img src="rutaimagen"/></div>
<div id="cadadiv"><img src="rutaimagen"/></div>