Skip to content

FlexItem

Description

Layout.FlexItem is a building block for flexbox based layout of contents and components. Can be used in combination with FlexContainer.

Demo

Contents
<Layout.FlexItem>Contents</Layout.FlexItem>

Widths

No width (default)

Contents

Small

Cont.

Medium

Contents

Large

Contents
<Layout.Card>
<P>No width (default)</P>
<Layout.FlexItem>
<TestElement>Contents</TestElement>
</Layout.FlexItem>
<P>Small</P>
<Layout.FlexItem width="small">
<TestElement>Cont.</TestElement>
</Layout.FlexItem>
<P>Medium</P>
<Layout.FlexItem width="medium">
<TestElement>Contents</TestElement>
</Layout.FlexItem>
<P>Large</P>
<Layout.FlexItem width="large">
<TestElement>Contents</TestElement>
</Layout.FlexItem>
</Layout.Card>