Can CSS3 Flex take only integer values?

Question

I often use CSS3 flexboxes - they make for easy, flexible layouts. CSS along the lines of

-webkit-box-flex: 4;
-moz-box-flex: 4;
-ms-flex: 4;
-webkit-flex: 4;
flex: 4;

is never a problem. However, I now have a situation where I need to provide a floating point value. I mean something along the lines of

-webkit-box-flex: 4.1;
-moz-box-flex: 4.1;
-ms-flex: 4.1;
-webkit-flex: 4.1;
flex: 4.1;

A quick and dirty experiment test - hot edits to the CSS in the console followed by width measurements in Chrome and Firefox with the PicPick pixel ruler - suggests that this works. However, I have not been able to find any definitive information - I tried the W3C docs but found them a bit to dense. The ever reliable caniuse does not quite clarify this either - on the subject. Could someone here tell me whether such fractional values are safe to use with the majority of recent mainstream browsers today?

Answer 1

According to the Mozilla Docs, https://developer.mozilla.org/en-US/docs/Web/CSS/flex , it takes a number value - which includes non-integers according to the MDN docs. All valid number values:

12          A raw <integer> is also a <number>
4.01        A positive non-integer <number>
-456.8      Negative non-integer <number>
0.0         Zero
+0.0        Zero, with a leading +
-0.0        Zero, with a leading - (Though strange, this is an allowed value)
.60         Digits are optional before the dot
10e3        The scientific notation is allowed
-3.4e-2     Most complex case of scientific notatio