Skip to main content

Flex Recipes

Flex recipes provide utility patterns for working with CSS Flexbox layouts in Etch.

  • flex-row: Creates a flex container with horizontal (row) orientation.

  • flex-column: Creates a flex container with vertical (column) orientation.

  • center-all: Centers content horizontally and vertically, with text aligned to the center.

  • center-left: Vertically centers content, aligning items to the left and text to the left.

  • center-right: Vertically centers content, aligning items to the right and text to the right.

  • center-top: Horizontally centers items at the top, with centered text.

  • center-bottom: Horizontally centers items at the bottom, with centered text.

Last updated on