2.2.0 • Published 4 years ago
@pridgey/ui-flexcontainer v2.2.0
@pridgey/ui-flexcontainer
The FlexContainer component displays the contents in a flex box configuration.
Basic Usage
<FlexContainer>
<div>one</div>
<div>two</div>
<div>three</div>
</FlexContainer>
FlexContainerProps
Prop Name | Type | Description |
---|---|---|
Direction? | "row", "column", "column-reverse", or "row-reverse" | The direction of the flex of the container. Defaults to "row". |
AlignItems? | "stretch", "center", "flex-start", "flex-end", or "baseline" | The alignment of the items in the flex container. Defaults to "center". |
JustifyContent? | "flex-start", "flex-end", "center", "space-between", or "space-around" | The justification of items in the flex container. Defaults to "center". |
Width? | number or string | Specifies the width of the flex container. Defaults to 100%. |
Height? | number or string | Specifies the height of the flex container. Defaults to 100%. |
children | React.ReacthChild[] | The stuff the container is flexing on. :muscle: |
Margin? | number or string | The margins of the flex contianer. |
Padding? | number or string | The padding of the flex contianer. |