Skip to content
Home

FlexItem

Info
Demos
Properties

Description

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

Demo

Contents
Code Editor
<Layout.FlexItem>Contents</Layout.FlexItem>

Widths

No width (default)

Contents

Small

Cont.

Medium

Contents

Large

Contents
Code Editor
<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>