title: Vertically Aligning Text In Navbar
body: <p>I am trying to use <code>&lt;span&gt;</code> to move some text in my navbar. My navbar is a <code>&lt;ul&gt;</code> and the elements are all <code>&lt;li&gt;</code>s but the text is aligned to the top of the navbar and I want it to be vertically centered. As you can see in the JSFiddle, I am using an a:hover property in CSS to change the background and color of the text when it's hovered over. When I apply the span to just the text, the whole hovering section gets moved too. See if you can understand what I mean.</p>
  
  <p>My JSFiddle is here:</p>
  
  <p><a href="http://jsfiddle.net/G8CJ7/" rel="noreferrer">http://jsfiddle.net/G8CJ7/</a> </p>
  
  <p>Basically I just want the text vertically aligned in a simple, concise way. Originally I was using '' tags and setting a margin on them but I want to avoid using header tags for this purpose for improved SEO. Thanks.</p>