Zadanie 5 - galeria flex/grid

Zadanie: galerie w 4 kolumnach po 2 rzędy

Cel: Utworzyć galerię obrazków, gdzie pierwsza część to 4 kolumny z 2 obrazkami w każdej kolumnie.

Przykład:

Zadanie 2: Galerie w 3 Kolumnach po 4 Obrazki

Cel: Utworzyć galerię obrazków, gdzie druga część to 3 kolumny z 4 obrazkami w każdej kolumnie.

Przykład:

Instrukcje do zadań:
Galeria w 4 Kolumnach po 2 Obrazki:

Użyj grid-template-columns: repeat(4, 1fr) do stworzenia czterech kolumn o równej szerokości.
Ustaw gap, aby przestrzenie między obrazkami były widoczne.
Dodaj media queries, aby zmienić układ na 2 kolumny przy mniejszych ekranach.
Galeria w 3 Kolumnach po 4 Obrazki:

Użyj grid-template-columns: repeat(3, 1fr) do stworzenia trzech kolumn.
Dodaj więcej obrazków, aby wypełnić wszystkie miejsca w siatce.
Użyj media queries, aby dostosować układ do 2 kolumn i jednej kolumny na jeszcze mniejszych ekranach.