title: React js css inline style margin right not working
body: <p>I want to implement margin-right inline CSS to the below react span element:</p>
  
  <pre><code>import React, { Component } from "react";   
  class NavBar extends Component {
    state = {
      totalCounters: 0,
    };      
    render() {    
      let styles = {
          margin-right: '20px',
          width: '250px',
          height: '250px',
          backgroundColor: 'yellow',
        };
      return (
        &lt;nav className="navbar navbar-light bg-light"&gt;
          &lt;a className="navbar-brand" href="#"&gt;
            Navbar
          &lt;/a&gt;
          &lt;span style={styles} className="badge badge-pill badge-secondary"&gt;
            {this.props.totalCounters}
          &lt;/span&gt;
        &lt;/nav&gt;
      );
    }
  }
  export default NavBar;
  </code></pre>
  
  <p>But it shows syntax error, while no error if replacing <code>margin-right</code> with <code>margin</code>. So how to do it?</p>