react js nuka carousel custom arrow positioning
<p>Im trying to correctly position custom arrows with the nuka carousel component. I mixed in the decorators but both of my arrows are side by side, how do i work around this? I want an arrow on the center left, and an arrow center right.</p>

<pre><code>var Decorators = [{
  component: React.createClass({
    render() {
      return (
        &lt;div&gt;
          &lt;i className="fa fa-chevron-circle-left fa-3x"
            onClick={this.props.previousSlide} aria-hidden="true"&gt;&lt;/i&gt;
          &lt;i className="fa fa-chevron-circle-right fa-3x"
            onClick={this.props.nextSlide} aria-hidden="true"&gt;&lt;/i&gt;
          &lt;/div&gt;
      )
    }
  }),
  position: 'CenterLeft',
  style: {
    padding: 20
  }
}];
</code></pre>

<p>here is an image of what i have and what i dont want</p>

<p><a href="https://i.stack.imgur.com/ggDRX.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ggDRX.jpg" alt="enter image description here"></a></p>