Flexbox Playground

Experiment with flex direction, justify, align, wrap and gap, with a live preview and CSS.

DirectionJustify contentAlign itemsWrapGap8px

CSS

display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: stretch;
flex-wrap: nowrap;
gap: 8px;

Tweak the container properties and watch the items rearrange, then copy the CSS. Runs locally.