title: Plus symbol line height
body: <p>I'm trying to create a list with circled numbers as bullets, with the last bullet being a plus symbol to add more items. The problem is that the HTML entity for the plus symbol doesn't vertically center like the numbers do.</p>
  
  <pre><code>&lt;li&gt;&lt;span&gt;1&lt;/span&gt;&lt;a href="#"&gt;Item one&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;span&gt;2&lt;/span&gt;&lt;a href="#"&gt;Item two&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;span&gt;+&lt;/span&gt;&lt;a href="#"&gt;add item&lt;/a&gt;&lt;/li&gt;
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/G1mNS.png" alt="See screenshot: [link][1]"></p>
  
  <p>I'm pretty strong with CSS, but it seems strange that there isn't some way to achieve this without images, which I'm pretty close to giving up and resorting to.</p>