Cluster

The cluster layout helper suits any group of elements that differ in length, are liable to wrap and need even spacing between them, e.g. lists of tags or groups of buttons. It uses the class l-cluster.

The outer container uses Flexbox, which gives us control of the alignment of the items inside. The gap property allows us to control the spacing between items.

CSS custom properties

--cluster-gap: Override the default spacing between cluster items, which is set to 1.25rem.

Item One
Item Two
Item Three
Item Four
Item Five
Item Six
Item Seven
Item Eight
Item Nine
Item Ten