# Stack

**Path:** CSS Framework/Layout

[Back to Documentation Index](http://rubicblazor.skyconis.com/docs.md)

---

Stack

 Shorthand helpers that build on top of our flexbox utilities to make component layout faster and easier than ever.

 Vertical

 Use .vstack to create vertical layouts. Stacked items are full-width by default. Use .gap-* utilities to add space between items.

 First item

 Second item

 Third item

 Using horizontal margin utilities like .ms-auto as spacers:

 First item

 Second item

 Third item

 Horizontal

 Use .hstack for horizontal layouts. Stacked items are vertically centered by default and only take up their necessary width. Use .gap-* utilities to add space between items.

 First item

 Second item

 Third item

 First item

 Second item

 Third item

 ✕

 Contents