CSS layout components that (basically) horizontally and vertically stack anything.

✌️ Check out the code here.

The .spacer is used in the (below) example to push the items apart.

<div class="flex hstack"> <div>🌭</div> <div>🍕</div> <div class="spacer"></div> <div>🍟</div> </div>

<div class="flex vstack"> <div>🌭</div> <div>🍕</div> <div>🍟</div> </div>

The example below stacks items vertically on mobile. However, the items stack horizontally at the medium breakpoint for tablets.

<div class="flex vstack hstack@md"> <div>🌭</div> <div>🍕</div> <div>🍟</div> </div>