title: Semantic UI floats
body: <p>Semantic UI newbie here, I couldn't find anywhere in the docs how (if it's possible) to float a simple element without having it to be something else (like a button or a segment).</p>
  
  <p>For instance, I have at the bottom of a page a step navigation/counter that is written like so:</p>
  
  <pre><code>&lt;div class="row three column"&gt;
      &lt;div class="column"&gt;
          &lt;br&gt;
          &lt;p class="ui left floated compact basic segment stepper"&gt;Step 2 of 3&lt;/p&gt;
          &lt;a class="ui right floated compact basic segment stepper"&gt;Go back&lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Beside the fact that <a href="https://stackoverflow.com/a/29195731/1717735">having to place a <code>&lt;br&gt;</code></a> before the floating elements looks kinda weird to me, isn't it possible to just add classes like <code>left floated</code> and have the thing foat? Like we'd with bootstrap with <code>pull-left</code>for instance…</p>
  
  <p>If I understand well, segment is for grouping related contents (corresponding semantically to the HTML5 <code>&lt;section&gt;</code> tag). Therefore, it seems a bit overkill – if not semantically wrong – to use <code>segment</code>s in such situations.</p>