title: Bootstrap inline button dropdown within <p> jumbotron
body: <p>Currently I have a jumbotron setup with some paragraph text, and I would like to stick a button dropdown inline with the text.</p>
  
  <p><strong>Dropdown button</strong></p>
  
  <pre><code>&lt;span class="btn-group"&gt;
    &lt;button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown"&gt;
      Button... &lt;span class="caret"&gt;&lt;/span&gt;
    &lt;/button&gt;
    &lt;ul class="dropdown-menu" role="menu"&gt;
      &lt;li&gt;&lt;a href="#"&gt;Opt 1&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#"&gt;Opt 2&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/span&gt;
  </code></pre>
  
  <p><strong>Jumbotron</strong></p>
  
  <pre><code>&lt;div class="jumbotron"&gt;
    &lt;h1&gt;Hello!&lt;/h1&gt;
    &lt;p&gt;Welcome&lt;/p&gt;
    &lt;p&gt;Another paragraph
     &lt;!-- dropdown is here --&gt;
    &lt;/p&gt;
  &lt;/div&gt; &lt;!-- jumbotron --&gt;
  </code></pre>
  
  <p>If the dropdown is within the <code>&lt;p&gt;</code> tag, it does not "dropdown" (but renders). If it is outside of the <code>&lt;p&gt;</code> tag it functions fine, but I would like it to be inline with the text and need the text to be in the <code>&lt;p&gt;</code> tag to get the style. Any ideas?</p>
  
  <p>Things to note -- If I replace the <code>&lt;span&gt;</code> tags with <code>&lt;div&gt;</code> tags, it will work fine within the <code>&lt;p&gt;</code> tags, but won't be inline.</p>
  
  <hr>
  
  <p><strong>Solution</strong></p>
  
  <p>Added <code>class="pull-left"</code> on the <code>&lt;p&gt;</code> tag to get it inline (from Esotericist's answer)</p>
  
  <pre><code>&lt;div class="jumbotron"&gt;
    &lt;h1&gt;Hello!&lt;/h1&gt;
    &lt;p&gt;Welcome&lt;/p&gt;
    &lt;p class="pull-left"&gt;Another paragraph&lt;/p&gt;
     &lt;!-- dropdown is here --&gt;
  
  &lt;/div&gt; &lt;!-- jumbotron --&gt;
  </code></pre>