Stack

<c-bs-stack direction="vertical" c-gap="3">
  <div class="p-2">First item</div>
  <div class="p-2">Second item</div>
  <div class="p-2">Third item</div>
</c-bs-stack>

<c-bs-stack direction="horizontal" c-gap="3">
  <div class="p-2">First item</div>
  <div class="p-2">Second item</div>
  <div class="p-2">Third item</div>
</c-bs-stack>

<c-bs-stack direction="horizontal" c-gap="3">
  <div class="p-2">First item</div>
  <div class="p-2 ms-auto">Second item</div>
  <div class="p-2">Third item</div>
</c-bs-stack>

<c-bs-stack direction="horizontal" c-gap="3">
  <div class="p-2">First item</div>
  <div class="p-2 ms-auto">Second item</div>
  <div class="vr"></div>
  <div class="p-2">Third item</div>
</c-bs-stack>

<c-bs-stack direction="vertical" c-gap="2">
  <c-bs-button variant="secondary">Save changes</c-bs-button>
  <c-bs-button variant="secondary" c-outline="True">Cancel</c-bs-button>
</c-bs-stack>

<c-bs-stack direction="horizontal" c-gap="3">
  <c-bs-form-control placeholder="Add your item here..." c-attrs="{'class': 'me-auto', 'aria-label': 'Add your item here...'}" />
  <c-bs-button variant="secondary">Submit</c-bs-button>
  <div class="vr"></div>
  <c-bs-button variant="danger" c-outline="True">Reset</c-bs-button>
</c-bs-stack>

<c-bs-stack direction="vertical">
  <div class="p-2">First item</div>
  <div class="p-2">Second item</div>
  <div class="p-2">Third item</div>
</c-bs-stack>

<c-bs-stack direction="horizontal">
  <div class="p-2">First item</div>
  <div class="p-2">Second item</div>
  <div class="p-2">Third item</div>
</c-bs-stack>