1//You have to give an automatic margin to all the items inside the flex.
2.flexbox {
3 display: flex;
4 justify-content: space-between;
5 }
6
7 .flex-item {
8 margin: auto;
9 }
1justify-content: flex-start | flex-end | center | space-between | space-around | space-evenly
1.upper
2{
3 margin:30px;
4 display:flex;
5 flex-direction:row;
6 width:300px;
7 height:80px;
8 border:1px red solid;
9
10 padding:5px; /* this */
11}
12
13.upper > div
14{
15 flex:1 1 auto;
16 border:1px red solid;
17 text-align:center;
18
19 margin:5px; /* and that, will result in a 10px gap */
20}
21
22.upper.mc /* multicol test */
23{flex-direction:column;flex-wrap:wrap;width:200px;height:200px;}