Space between

Preview

Vertical (default)
FirstSecondThird
Horizontal
FirstSecondThird
Sizes (horizontal)
xxxsgapsgaplgapxxlgap

Usage

<cs-space-between size="m">
  <div>Item one</div>
  <div>Item two</div>
</cs-space-between>

<cs-space-between direction="horizontal" size="s">
  <cs-badge color="blue">A</cs-badge>
  <cs-badge color="green">B</cs-badge>
</cs-space-between>

Properties

align-itemsSpaceBetweenProps.AlignItems

Determines how the child elements will be aligned based on the align-items property of the CSS Flexbox.

directionSpaceBetweenProps.Direction default: 'vertical'

Defines the direction in which the content is laid out.

sizeSpaceBetweenProps.Sizerequired

Defines the spacing between the individual items of the content.

Slots

default

Content of this component.