Skip to content
LAYOUT · FREE

Spacer

Push items to the far end of a row.

An empty element that grows to fill the free space in a row and pushes the items after it to the end.

Why it helps

  • Pushes items apart
  • No extra CSS
  • Works in flex rows

Where it fits

  • Toolbars
  • App bars
  • Footers
Spacer control in a RayCraft page

Example

<Toolbar Label="Page actions">
    <strong>Report</strong>
    <Spacer />
    <Button Variant="Variant.Text" Size="Size.Small" StartIcon="IconName.Print">Print</Button>
    <Button Size="Size.Small" StartIcon="IconName.Save">Save</Button>
</Toolbar>

A short fragment. Add @using RayCraft.Blazor.Components to your page and use an interactive render mode.

Included in RayCraft Free. Working examples are in the GitHub repository (MIT); it holds example and demo code, not the library code.

All controls ยท Documentation