Flexible Box Module or Flexbox is a type of layout model. The main aim of this layout is to distribute space between items in a container. This layout is a one-dimensional layout model. The flexbox layout even works when the size of the items is unknown or dynamic.
To set space between the flexbox you can use the flexbox property justify-content you can also visit all the property in that link.
We can use the justify-content property of a flex container to set space between the flexbox.
- The value space-between is used for displaying flex items with space between the lines.
- The value space-around is used for displaying flex items with space between, before and after the lines.
The below example will illustrate the property used for setting space between the flexbox.
- Advance CSS layout with flexbox
- How to set flexbox having unequal width of elements using CSS ?
- How to align flexbox columns left and right using CSS ?
- Flexbox utilities in bootstrap with examples
- How to vertically and horizontally align flexbox to center ?
- How to vertically align text inside a flexbox using CSS?
- How to make flexbox children 100% height of their parent using CSS?
- Space between two rows in a table using CSS?
- CSS | white-space Property
- How to put images in a box without space using Bootstrap?
- How to add space (" ") after an element using :after selector in CSS ?
- How to set vertical space between the list of items using CSS ?
- Clone a stack without extra space
- How to remove the space between inline-block elements?
- Program to replace every space in a string with hyphen
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.