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
- Flexbox utilities in bootstrap with examples
- How to set flexbox having unequal width of elements using CSS ?
- How to vertically align text inside a flexbox using CSS?
- How to vertically and horizontally align flexbox to center ?
- How to make flexbox children 100% height of their parent using CSS?
- Space between two rows in a table using CSS?
- How to add space (" ") after an element using :after selector in CSS ?
- CSS | white-space Property
- Clone a stack without extra space
- How to tab space instead of multiple non-breaking spaces (nbsp)?
- How to make a div fill a remaining horizontal space using CSS?
- Program to replace every space in a string with hyphen
- How to remove the space between inline-block elements?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to firstname.lastname@example.org. 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.