title: Bootstrap-based layout - navbar-brand to display img & text inline & aligned
body: <p>I'm working on a site for my employer and have run into a little bit of an issue during our "rebranding" stage. The page in question can be found here: <a href="http://chargehubdevchris.azurewebsites.net/" rel="nofollow">http://chargehubdevchris.azurewebsites.net/</a></p>
  
  <p>The issue is specifically with the index page, and concerns the brand logo / text. The text is using a web font (that we generated) and the logo is an image placed inline within the Navbar-brand class anchor tag. </p>
  
  <p>The img is forcing both elements to drop down about 10px from the desired height, and exceeding the nav's desired height.</p>
  
  <p>The code in question is as follows:</p>
  
  <pre><code>&lt;div class="navbar-header page-scroll"&gt;
  &lt;button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"&gt;
                  &lt;span class="sr-only"&gt;Toggle navigation&lt;/span&gt;
                  &lt;span class="icon-bar"&gt;&lt;/span&gt;
                  &lt;span class="icon-bar"&gt;&lt;/span&gt;
                  &lt;span class="icon-bar"&gt;&lt;/span&gt;
              &lt;/button&gt;
            &lt;a class="navbar-brand page-scroll" href="#page-top"&gt;&lt;img class="homelogo" src="logos/ChargeHub-Logo.png"/&gt;&lt;span class="greylogo"&gt;Charge&lt;/span&gt;Hub&lt;/a&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>I've tried to use the "pull-left" class on the img, which then aligns the text properly with the rest of the nav, but leaves the img out of line. I've applied the pull to other elements, attempted adjusting Vertical-align, and even some negative margins. They didn't really accomplish what I wanted, without causing more of a headache down the line. </p>
  
  <p>I have also tried placing them in a div, floating it, setting it to display inline-block, but I couldn't get it to play nicely. </p>
  
  <p>I know I must be missing something probably rather obvious, but I've tried all that I can think of, and everything that I could find online to no avail, and was hoping somebody could help me sort this. It seems like there MUST be an easy way for bootstrap to accomplish this, as I cannot be the first to try!</p>