How to indent between blocks in a flex container correctly?

Question

css

https://codepen.io/poylar/pen/poPdoZP Let
's take a banal example. I need padding between 1rem blocks, but there should be no padding at the edges of wrap.
On grids, I would do grid-gap, but on flexes, what is the right way?

Answer 1

Usually, in such cases, I always do something like this
https://codepen.io/alekcena/pen/eYWeYPy

Answer 2

something like this https://jsfiddle.net/vasif534/4vwanmh3/38/

Answer 3

Gap works with flex, but support isn't great