benjaminpalko/.opencode/skills/daisyui/components/join.md

join

Join is a container for grouping multiple items, it can be used to group buttons, inputs, etc. Join applies border radius to the first and last item. Join can be used to create a horizontal or vertical list of items

join docs

Class names

• component: join, join-item
• direction: join-vertical, join-horizontal

Syntax

<div class="join {MODIFIER}">{CONTENT}</div>

Rules

• {MODIFIER} is optional and can have one of the direction class names
• Any direct child of the join element will get joined together
• Any element with join-item will be affected
• Use lg:join-horizontal for responsive layouts