Flexbox

Webdesign & UX

Flexbox (Flexible Box Layout) is een CSS-module voor eendimensionale lay-outs die elementen flexibel in rijen of kolommen rangschikt, ideaal voor responsieve ontwerpen. In webdesign vereenvoudigt het de uitlijning en verdeling; in SEO ondersteunt het mobiele optimalisatie.

Flexbox rangschikt elementen in één richting, horizontaal of verticaal, en verdeelt de beschikbare ruimte ertussen. Dit lost taken op in tabellen met drie rijen die voorheen het gebruik van tabellen of zwevende elementen vereisten.

De vuistregel om ze te onderscheiden: Flexbox voor één as, Grid voor twee. Een header met een logo links en navigatie rechts is Flexbox. Een raster van twaalf kaarten met identieke kolommen en rijen is Grid. Iedereen die alles met Flexbox bouwt, zal vanaf de tweede rij problemen ondervinden met regeleinden; iedereen die alles met Grid bouwt, zal zich in allerlei bochten wringen met simpele rijen.

Terug naar de woordenlijst