# Oefeningen

### Oefening 1: Maak je Website Volledig Responsief

#### Wat te doen?

- **Pas media queries toe** om je website aan te passen voor verschillende schermgroottes.
- **Controleer je website op verschillende apparaten** of gebruik de ontwikkelaarstools van je browser om te simuleren.

#### Tips

- Begin met een **mobile-first** benadering.
- Gebruik **flexibele eenheden** zoals percentages of `fr` in Grid.
- Test op **breekpunten** zoals 480px (mobiel), 768px (tablet), en 1024px (desktop).

### Uitdaging 1: Gebruik van Grid Areas

#### Wat te doen?

- Maak gebruik van **grid-template-areas** om je layout te definiëren.

### Uitdaging 2: Voeg Een Responsieve Afbeeldingsgalerij Toe

#### Wat te doen?

- Maak een sectie met afbeeldingen die zich aanpassen aan de schermgrootte.
- Gebruik CSS Grid om de afbeeldingen in een raster te plaatsen dat verandert op basis van het scherm.

#### Tips

- Gebruik `grid-template-columns` met de `repeat()` en `auto-fill` of `auto-fit` functies.