PostCSS polyfill flex gap

This plugin polyfills all flexbox gaps into margins for older browsers.

Basic example

1/* input */
2.list {
3  display: flex;
4  gap: 10px;
5}
6.item {
7  display: flex;
8  background-color: red;
9}
10
11/* output */
12.list {
13  display: flex;
14}
15.list > *:not(:last-child) {
16  margin-right: 10px;
17}
18.item {
19  display: flex;
20  background-color: red;
21}

flex-wrap

This plugin DOES NOT process flex-wrap: wrap

1/* input */
2.list {
3  display: flex;
4  flex-wrap: wrap;
5  gap: 10px;
6}
7
8/* output */
9.list {
10  display: flex;
11  flex-wrap: wrap;
12  gap: 10px;
13}