title: How do you add multiple browser specific values into a CSS style in React?
body: <p>This is mainly to define browser specific values like this one for a given CSS property:</p>
  
  <pre><code>&lt;div style="cursor: -moz-grab; cursor: -webkit-grab; cursor: grab;"&gt;Grab me!&lt;/div&gt;
  </code></pre>
  
  <p>If I wrap it into object like this:</p>
  
  <pre><code>&lt;div style={{
      cursor: "-moz-grab",
      cursor: "-webkit-grab",
      cursor: "grab"
  }}&gt;Grab me!&lt;/div&gt;
  </code></pre>
  
  <p>then you duplicate keys in an object (would fail in strict mode and would overwrite otherwise). And simply putting all values into single string doesn't seem to work either. </p>
  
  <p>Figuring out browser with JS and then applying right value seems to be too much work.. Or is there a different approach to do this? Any ideas?</p>