Lumeo

Flex

A low-level flexbox container with full control over direction, alignment, and wrapping.

Installation

dotnet add package Lumeo

One-time app setup (AddLumeo(), CSS & JS) is covered in the installation guide.

Usage

@using Lumeo

<Flex />
Item 1
Item 2
Item 3

Logo

Centered content

9
9
9
9
9
9
9
9

API Reference

Flex

Property Type Default Description
Direction string? "row" Flex direction. Maps to flex-{value} (e.g. "row", "col", "row-reverse", "col-reverse").
Gap string? Spacing between items. Maps to gap-{value} (e.g. "2", "4", "8").
Align string? Cross-axis alignment. Maps to items-{value} (e.g. "center", "start", "end").
Justify string? Main-axis alignment. Maps to justify-{value} (e.g. "center", "between", "end").
Wrap bool false Whether items should wrap to the next line when they overflow.
Inline bool false Use inline-flex instead of flex for inline layout.