Spacing between flexbox items

Question

This is what I want:

The closest I\'ve got. Applying margin on flexbox items, then re

Answer 1

Trying to stick on your question:

Is there a way to take the visual order into account when applying the margin?

I would say no, the same way you cannot style an element based on the value of, let's say, its background color. To do so, you could write custom classes to set the flex order and then subclass based on them.

Please check out this interesting thread where I posted my solution on spacing: Better way to set distance between flexbox items