Bug inline styles flex value

Steps to Reproduce: https://jsfiddle.net/reactjs/69z2wepo/

class Hello extends React.Component {
  render() {
    return <div style={{ flex: '1 0 0' }}>Hello</div>;
  }
}
ReactDOM.render(
  <Hello />,
  document.getElementById('container')
);

Expected Result: <div style="flex: 1 0 0;">Hello</div>

Actual Result: <div style="flex: 1 0 0px;">Hello</div>

Notes: Why change 0 to 0px ?? I’m not sure IE11 works with 0 the same way as 0px… Also why not change the second digit then also? 0px and 0 is the same also, so the suffixing of px there is just a waste and can cause potential bugs.

https://stackoverflow.com/a/22883146/846348

[gaearon]

I verified all React does is set node.style.flex = '1 0 0'. React doesn’t append any px suffix so you’re dealing with some browser issue here.

[OZZlE]

@gaearon it should put node.style.flex = '1' because that is what I wrote… why does it need to mess up IE11??

I have to use a stylesheet to get flex: 1; because inline is modified from what I actually wrote!!!