<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
<style>
.flex {
display: flex;
font-size: 30px;
text-align: center;
background-color: #7d7d7d;
color: #000000;
font-weight: bold;
}
.flex2 {
justify-content: space-around;
}
.flex3 {
justify-content: space-between;
}
.flex-items {
background-color: #cccaca;
width: 90px;
height: 60px;
margin: 10px;
text-align: center;
font-size: 40px;
line-height: 1.5;
}
</style>
</head>
<body>
<h1>Space between flexbox</h1>
<h2>justify-content: space-around </h2>
<div class="flex flex2">
<div class="flex-items">1</div>
<div class="flex-items">2</div>