Bij elke nieuwe revisie van CSS komt een overvloed aan nieuwe, opwindende attributen aan het licht; een daarvan is het ingetogen display: flexibele aanpak.

Het lay-outmodel van de flexbox zweeft nu een tijdje rond het web, elke keer met zijn eigen variatie op de benadering (sommige zijn verouderd, zoals de display: box of display: flexbox-methode).

In de handleiding van vandaag ontdekken we de voordelen van het gebruik van de flexbox-techniek in onze eigen lay-outs.

Enkele geweldige functies van het nieuwe model zijn onder meer:

  • Gemakkelijke ratio-gebaseerde dimensionering; niet nodig om uw HTML aan te raken
  • Herorden met een briesje door gehele getallen in de stylesheet te gebruiken
  • Van toepassing op alle onderliggende elementen binnen een correct gedefinieerd bovenliggend item
  • Nooit meer clearfixes!

In deel 2 we gaan kijken hoe we dit nog verder kunnen verbeteren en veranderen je flexbox-lay-out in een volwaardig responsief ontwerp!

Heb je de lay-out van de flexbox gebruikt voor lay-out? Heb je liever een andere methode? Laat het ons weten in de comments.

Uitgelichte afbeelding / thumbnail, flexibel beeld via Shutterstock.