Responsive - svennijhuis/Blok-tech GitHub Wiki

Mijn app heb ik responsive gemaakt. Je kan deze app dus op verschillende devices bekijken.

Ik heb dit op twee verschillende manieren gedaan om te laten zien dat ik niet vast zit aan een manier van werken.

Ik heb dit scherm responsive gemaakt met media quary en de with aangegeven met procenten. Daarnaast was de flex-box ook een belangrijk onderdeel.

Voorbeeld:

.d-flex-wrap{
   display: flex;
   flex-direction: column;
   width: 45%;
}

Afbeelding groot device

Afbeelding mobile device

ik heb dit scherm responsive gemaakt met media quary en grid.

Voorbeeld:

.grid-container {
   display: grid;
   grid-template-columns: 10fr 15fr;
   gap: 25px;
   margin-bottom: 20px;
 }

Afbeelding groot device

Afbeelding mobile device