griffel
griffel copied to clipboard
`shorthands.flex(1)` should produce `flex: 1 1 0%` instead of `flex: 1 1 0px`
When you set a css property to flex: 1
in any of the major browsers the result isflex: 1 1 0%
. But the griffel shorthand shorthands.flex(1)
produces flex: 1 1 0px
.
What's maybe even weirder is that the standard actually defines that flex: <positive-number>
is the equivalent of flex: <positive-number> 1 0;
. But somehow all browser vendors decided that this is just wrong and produce flex: 1 1 0%
as mentioned above.
Either way following reality or following the standard griffel produces an incorrect output. Ideally it should follow how the major browser vendors do it to have the same developer experience as specifying flex: 1
, because otherwise this can be a real pitfall.