I need to create a div with a height of 120px using only the CSS property display: flex. I am not allowed to use float and can only use div elements.
Here is the code I have so far, but I'm unsure how to achieve the desired outcome:
.flex-container {
display: flex;
flex-wrap: wrap;
background-color: DodgerBlue;
width: 240px;
}
.flex-container>div {
background-color: #f1f1f1;
width: 60px;
height: 60px;
text-align: center;
line-height: 75px;
font-size: 30px;
}<div class="flex-container">
<div>1</div>
<div>2</div>
<div>3</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
<div>9</div>
<div>10</div>
<div>11</div>
<div>12</div>
</div>The final design should look like this: