postcss-flexbugs-fixes

PostCSS plugin This project tries to fix all of flexbug's issues

MIT 22 个版本

postcss css postcss-plugin flexbugs flexbox flex

npm install postcss-flexbugs-fixes

yarn add postcss-flexbugs-fixes

pnpm add postcss-flexbugs-fixes

bun add postcss-flexbugs-fixes

PostCSS Flexbugs Fixes

PostCSS plugin This project tries to fix all of flexbug's issues.

.foo { flex: 1; }
.bar { flex: 1 1; }
.foz { flex: 1 1 0; }
.baz { flex: 1 1 0px; }

.foo { flex: 1 1; }
.bar { flex: 1 1; }
.foz { flex: 1 1; }
.baz { flex: 1 1; }

.foo { flex: 1; }

.foo { flex: 1 1 0%; }

This only fixes css classes that have the flex property set. To fix elements that are contained inside a flexbox container, use this global rule:

* {
    flex-shrink: 1;
}

.foo { flex: 1 0 calc(1vw - 1px); }

.foo {
  flex-grow: 1;
  flex-shrink: 0;
  flex-basis: calc(1vw - 1px);
}

postcss([require('postcss-flexbugs-fixes')]);

You can also disable bugs individually, possible keys bug4, bug6 and bug8a.

var plugin = require('postcss-flexbugs-fixes');
postcss([plugin({ bug6: false })]);

See PostCSS docs for examples for your environment.

5.0.2 2020-11-20

5.0.1 2020-11-08

5.0.0 2020-10-31

4.2.1 2020-04-27

4.2.0 2020-02-04

4.1.0 2018-07-30

4.0.0 2018-07-18

3.3.1 2018-04-28

3.3.0 2018-01-18

3.2.0 2017-07-31

3.1.0 2017-07-31

3.0.0 2017-05-10

2.1.1 2017-04-12

2.1.0 2016-12-06

2.0.0 2015-10-16

1.1.0 2015-09-12

1.0.0 2015-09-02

0.0.5 2015-07-16

0.0.4 2015-07-16

0.0.3 2015-06-20

0.0.2 2015-06-20

0.0.1 2015-06-20