title: Make react bootstrap tabs only show in only one row
body: <p>I am using react bootstrap tabs, i want to show them in only one row like sublime or atom, but the problem is they will auto break line when they reach the the width of container.
  Anyone knows how i can do that.
  Thanks so much!
  Below is my code, just using simple tabs of react bootstrap</p>
  
  <pre><code>return (
    &lt;div&gt;
      &lt;Tabs&gt;
        {this.props.tabState.map(function(v, i, obj) {
          return (
            &lt;Tab key={i} eventKey={i} title={titleWithBtn(v, i)} &gt;
              {childrenWithProps({file:v, tabIndex:i})}
            &lt;/Tab&gt;
          )
        })}
      &lt;/Tabs&gt;
    &lt;/div&gt;
  );
  </code></pre>
  
  <p><strong>Solution</strong> <br>
  I can do this perfectly by using this <a href="https://www.npmjs.com/package/react-draggable-tab" rel="nofollow noreferrer">npm</a></p>