title: How to force Office UI Fabric ChoiceGroup to align horizontal
body: <p>I am trying to build a <em>SPFx webpart</em> containing a <em>ChoiceGroup</em>. When I set the css style to <code>ms-sm12</code> the choices are aligned vertical:</p>
  
  <pre><code>Show assigned to:
  o anyone
  * me
  o nobody
  </code></pre>
  
  <p>I like them to align horizontal in one row:</p>
  
  <pre><code>Show assigned to: o anyone * me o nobody
  </code></pre>
  
  <p>When I set the style to <code>ms-sm6</code>, it aligns them "mixed":
  The <em>Slider</em> and <em>Toggle</em> are set to <code>ms-sm3</code></p>
  
  <pre><code>Show assigned to: o anyone
  * me
  o nobody
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/x8TIf.png" rel="noreferrer"><img src="https://i.stack.imgur.com/x8TIf.png" alt="Mixed"></a></p>
  
  <p>With <code>ms-sm4</code> it looks like:</p>
  
  <p><a href="https://i.stack.imgur.com/dFMAG.png" rel="noreferrer"><img src="https://i.stack.imgur.com/dFMAG.png" alt="ms-sm4"></a></p>
  
  <p>With <code>ms-sm3</code>, <code>ms-sm2</code>, <code>ms-sm1</code> it looks like (the title getting more and more squashed and all options in one column:</p>
  
  <p><a href="https://i.stack.imgur.com/KQHnP.png" rel="noreferrer"><img src="https://i.stack.imgur.com/KQHnP.png" alt="enter image description here"></a></p>
  
  <p>How can I force / encourage the options to be rendered horizontal?</p>