[FIXED FOR NOW] Need help with flexbox

I need help with flexbox. I need the flexbox "grid" to be in 2x2 squares. I have no idea how to make it that there are only 2 boxes per "row". All what I have been able to do is to have them all in a row or column.

Image of the idea that I have:

In this image I have 2x2 grid of boxes that are responsive and the boxes have something inside. I have been able to center the elements inside the boxes.

I am also using grid on the website for the other layout but I feel like using flexbox for these type of elements is more convenient.

Thank you for reading and helping out!

Comments

[JoelBonetR 🥇]

Does that suit the use case?

.flexrow {
  display: flex;
  flex-flow: row wrap;
}
.element {
  flex: 0 1 50%;
  max-width: 50%;
}

<div class="flexrow">
  <div class="element"> something 1</div>
  <div class="element"> something 2</div>
  <div class="element"> something 3</div>
  <div class="element"> something 4</div>
</div>

Regards

[Eixi]

thank you for the help! i just googled about this and found a codepen that has similar stuff u got. i got the stuff resolved for now. thank you for the help :D

[JoelBonetR 🥇]

😁 if you search Katana UI in codepen you may found a bunch of stuff I coded some time ago, plenty of flexbox things.
Also check my profile for posts around CSS with and without flex.

Cheers!