title: Button not animating from center
body: <p>So when I used jquery to animate some padding instead of animation as if the anchor point is from the center it animates from the top left. All the code and a JSFiddle link are down below.</p>
  
  <p><a href="https://jsfiddle.net/ky3fjfer/" rel="nofollow">JSFiddle</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="gaming-news-info"&gt;
      &lt;a id="news-button" style="cursor:pointer;"&gt;Go to News section&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS: </p>
  
  <pre><code>#gaming-news-info {
      position: absolute;
      z-index: 999;
      width: 400px;
      height: 200px;
      top: 50%;
      left: 50%;
      transform: translateX(-50%) translateY(-50%);
      margin-top: -100px;
  }
  
  #news-button {
      background-color: #4CAF50;
      border: none;
      color: white;
      padding: 15px 32px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 16px;
      margin: 4px 2px;
      cursor: pointer;
      position: absolute;
      margin-top: 130px;
      font-family: "Prompt-SemiBold";
      margin-left: 90px;
  }
  </code></pre>