KAIROS
CODERS
Blogs
How we do it?
Contact
What we do?
Why choose US?
Tools
What we've done?
Back to Tools
CSS Flexbox & Grid Builder
Layout Settings
Flexbox
CSS Grid
Add / Remove Items
+ Add Box
- Remove Box
Flex Direction
row
row-reverse
column
column-reverse
Flex Wrap
nowrap
wrap
wrap-reverse
Grid Template Columns
e.g. 1fr 2fr 1fr or repeat(3, 1fr)
Grid Template Rows
Justify Content
flex-start (start)
flex-end (end)
center
space-between
space-around
space-evenly
Align Items
stretch
flex-start (start)
flex-end (end)
center
baseline
Gap:
16px
Copy
Your experience on this site will be improved by allowing cookies.
Allow cookies
