title: How to draw a circle with text in the middle?
body: <p>I found this example on stackoverflow:</p>
  
  <p><a href="https://stackoverflow.com/questions/6936972/draw-circle-using-css-alone">Draw Circle using css alone</a></p>
  
  <p>Which is great.  But I'd like to know how to modify that example so that I can include text in the middle of the circle?</p>
  
  <p>I also found this:  <a href="https://stackoverflow.com/questions/4801181/vertically-and-horizontally-centering-text-in-circle-in-css-like-iphone-notific">Vertically and horizontally centering text in circle in CSS (like iphone notification badge)</a></p>
  
  <p>but for some reason, its not working for me.  When I create the following test code: </p>
  
  <pre><code>&lt;div class="badge"&gt;1&lt;/div&gt;
  </code></pre>
  
  <p>instead of a circle, I get a oval shape.
  I'm trying to play around with the code to see how I can get it to work.</p>