title: Bootstrap 3: text on the left and right in the page header
body: <p>I'm trying to make a simple page header with bootstrap 3. Here's the code:</p>
  
  <pre><code>&lt;div class="page-header"&gt;
      &lt;h1&gt;Text on the left&lt;/h1&gt;
      &lt;h3 class="text-right"&gt;This to the right but on the same line&lt;/h3&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Here's a jsfiddle to try: <a href="http://jsfiddle.net/DTcHh/2450/" rel="noreferrer">http://jsfiddle.net/DTcHh/2450/</a></p>
  
  <p>Basically I just want to have text on the left and right inside the <code>page-header</code>, but <strong>on the same line</strong>.</p>
  
  <p>The usual tricks of using <code>float:left</code> and <code>float:right</code> as with normal html "break" the <code>page-header</code>, meaning the text is properly aligned but is displayed outside (under) the page-header, which remains empty.</p>
  
  <p>Any clues?</p>