title: HTML/CSS Logo with Text
body: <p>So I was trying achieve <a href="https://i.stack.imgur.com/CsBAs.jpg" rel="nofollow noreferrer">this logo</a> but the text wont go in middle.</p>
  
  <p>I have tried vertical align and line-height but no luck. Hope someone helps :)</p>
  
  <p>Code:</p>
  
  <pre><code>&lt;div&gt;
      &lt;div id="logo"&gt;
          &lt;a href="#"&gt;&lt;div id=""&gt;&lt;/div&gt;&lt;/a&gt;
          &lt;p&gt;title&lt;br&gt;
          text&lt;/p&gt;
      &lt;/div&gt;
      &lt;div id=""&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>#header {height: 100px; background: #fff}
  #logo div {background: url(/img/logo.png) center/contain no-repeat; width: 70px; height: 70px; float: left}
  #logo p {vertical-align: middle}
  </code></pre>