title: "vertical-align:middle;" is not working inside td
body: <p>I don't understand. This is a very simple document and I can't see any reason it shouldn't work.</p>
  
  <p>CSS:</p>
  
  <pre><code>.button {
      background-color: transparent;
      border-radius: 50%;
      border: 5px solid #ff0099;
      display: table-cell;
      vertical-align: middle;
      height: 175px;
      width: 175px;
      text-decoration:none;
      text-align: center;
      word-wrap: break-word;
  }
  .button:hover {
      text-decoration: underline;
  }
  .button p {
      font-family: Helvetica, Arial, sans-serif;
      font-weight: 100;
  }
  table {
      border-spacing: 20px 10px;
      border-collapse: separate;
  }
  td {
      vertical-align:middle;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;td&gt;
  &lt;a href="#" class="button" target="_blank"&gt;&lt;p&gt;Insert text here, enough to push it over the edge&lt;/p&gt;&lt;/a&gt;
  
          &lt;/td&gt;
          &lt;td&gt;
  &lt;a href="#" class="button" target="_blank"&gt;&lt;p&gt;Insert text here, enough to push it over the edge&lt;/p&gt;&lt;/a&gt;
  
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>As far as I know, vertical-align was meant for use in td's, so I'm not sure why it isn't working.</p>