title: How To Center Text Inside Of A CSS Shape
body: <p>I am trying to make a homepage for some work and I want to make a nice little button that says 'Home'. However, I am not to the point of implementing the onclick yet so don't worry about that. I tried making the shape that I want.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>#home {
    background: #5F9EA0;
    border-radius: 25px;
    margin: auto;
    width: 200px;
    height: 100px;
    text-align: center;
    font-size: 25px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id = "home"&gt;Home&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Again, I am trying to center the text 'Home' inside of the shape so it looks like it is in the middle of it.</p>