decrease space between with display flex space evenly code example

Example 1: add space between all html elements flex

/* There is now a `gap` CSS property
** This works for , , and  layouts
** #box{} would lay out all it's children with 10px spacing between 
** different rows and 20px betwen different columns
*/
#box {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px; /* row-gap [column-gap]*/
}

/* Supported by most modern browesers, Safari excluded. */

Example 2: flexbox space between

justify-content: flex-start | flex-end | center | space-between | space-around | space-evenly

Tags:

Misc Example

Related