Przesunięcie div'ów kiedy pomniejszam stronę

Question

Witam,

mam problem w HTML. Dopiero zaczynam przygodę ze stronami (znam tylko HTML i CSS). Mam do zrobienia stronę, a nauczyciel wymagał aby strona była zrobiona na podstawie tabeli. Chciałbym sprawić, aby div (na obrazku w linku w komórce "zawartość"; jest w nim tylko obraz) przesunął się niżej jeśli nie mieści się on już w komórce tabeli, np. przy podzielonym ekranie, kiedy okno jest zmniejszone. Divy są ustawione w rzędzie z użyciem " float: left; ".

Poglądowo jak to wygląda:

PODGLĄD

 

Od krawędzi okna do krawędzi tabeli jest mały margines, sam obrazek też ma luz w div'ie.

Dziękuję za pomoc.

Answer 1

.container {
  display: flex;
  flex-wrap: wrap;
}

.container div {
  flex: 1 0 200px; /* elastyczna szerokość elementu */
  margin: 10px; /* margines między elementami */
  /* inne style */
}

Tak pokombinuj 

Poczytaj o flex i flex-wrap