Grid
Use the KGrid component to create flexible, responsive layouts based on CSS Flexbox.
Responsive Flex Grid
content1asdasdaasdasd
KGrid(:flex-child="true" align="stretch" justify="space-between")
KPanel Item 1
KPanel Item 2
KPanel Item 3
Configure the KGrid component using these attributes.
| Name | Type | Default | Description |
|---|
| direction | 'row' | 'column' | 'row' | The flex-direction of the grid |
| wrap | 'wrap' | 'nowrap' | 'wrap' | Defines whether flex items are forced onto one line or can wrap |
| flexChild | boolean | false | Applies basic flex sizing (flex: 1) to direct children |
| align | 'start' | 'center' | 'end' | 'stretch' | 'baseline' | 'start' | Aligns items vertically (align-items) |
| justify | 'start' | 'center' | 'end' | 'space-between' | 'around' | 'evenly' | 'start' | Aligns items horizontally (justify-content) |
| noGap | boolean | false | Removes the default gap between flex items |