Grid of Flex? Hangt er van af.

Grids zijn stramienen

Als je een heel strak stramien nodig hebt dat uitgelijnd is, zoals voor de 3 witte kolommen op deze pagina, gebruik dan grid. Wil je dat de HTML elementen rekening houden met hun flexibele inhoud bij het bepalen van de lay-out, zoals bij de zwarte tags in de witte kolommen rechts, gebruik dan flex!

Hieronder is als uitzondering grid in plaats van flex gebruikt voor de container met de zwarte tags . Let op hoe de zwarte tags zich gedragen. ze zijn niet flexibel meer van zichzelf en blijven het grid stramien volgen.

Grid

Flex is flexibel

Als je een heel strak stramien nodig hebt dat uitgelijnd is, zoals voor de 3 witte kolommen op deze pagina, gebruik dan grid. Wil je dat de HTML elementen rekening houden met hun flexibele inhoud bij het bepalen van de lay-out, zoals bij de zwarte tags hieronder, gebruik dan flex!

.tags {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    }
            

Flex

Flex is flexibel

Als je een heel strak stramien nodig hebt dat uitgelijnd is, zoals voor de 3 witte kolommen op deze pagina, gebruik dan grid. Wil je dat de HTML elementen rekening houden met hun flexibele inhoud bij het bepalen van de lay-out, zoals bij de zwarte tags hieronder, gebruik dan flex!

.tags a {
    display: flex;
    flex-grow: 1;
    }
            

Flex