title: Bootstrap - Pull Icon to Left of Text
body: <p>In Bootstrap 3, I want to have an icon centered to the left of an H6 and some text.</p>
  
  <p>Here's my code:</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-sm-8"&gt;
           &lt;div class="pull-left"&gt;&lt;i class="fa fa-life-ring fa-3x"&gt;&lt;/i&gt;&lt;/div&gt;
           &lt;div class="pull-right"&gt;
           &lt;h6&gt;Unlimited Support&lt;/h6&gt;
           We're here to help! Just ask away...
           &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>It looks like this right now (icon is above the text, rather than on the left):</p>
  
  <p><img src="https://i.stack.imgur.com/76HYg.png" alt="screenshot1"></p>
  
  <p>How do I get it to format correctly?</p>
  
  <p>This code:</p>
  
  <pre><code>&lt;div class="row"&gt;
      &lt;div class="col-sm-8"&gt;
           &lt;div class="pull-right"&gt;
               &lt;h6&gt;&lt;i class="fa fa-life-ring fa-3x"&gt;&lt;/i&gt; Unlimited Support&lt;/h6&gt;
               We're here to help! Just ask away...
           &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Displays like this:</p>
  
  <p><img src="https://i.stack.imgur.com/I45S8.png" alt="screenshot2"></p>
  
  <p>But, I want to put the icon beside both lines of text (have the "We're here..." move to the right/not wrap underneath.</p>