Using CSS transform: translate(...) with ReactJS

ReactJS_transform_CSS_example.js

render: function() {

    var cleft = 100;
    var ctop = 100;
    var ctrans = 'translate('+cleft+'px, '+ctop+'px)';
    var css = {
	 transform: ctrans 
    }
		
      return ( 
       <div style={css} />
       )

}

According to https://facebook.github.io/react/tips/inline-styles.html

CSS styles need to be passes as an object to the component. However, if you are trying to use transform styles, you need to first concatenate the string and then pass it to the object. Otherwise, you will get an error.

Here's another way that worked for me:

<div style={{ transform: `translate(10px, 20px)` }}></div>