title: CSS table column autowidth in HTML Outlook e-mail
body: <p>I'm trying to make a centralize button in HTML e-mail. The tricky part here is my wish the button to be as wide as its content. The following code works perfect except in Outlook.  </p>
  
  <p>Here is the HTML:</p>
  
  <pre><code>&lt;table width="100%" border="0" cellpadding="0" cellspacing="0"&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td&gt;&lt;/td&gt;
              &lt;td style="width:1%;white-space:nowrap"&gt;
                  &lt;a href="#" style="text-decoration:none"&gt;
                      &lt;table width="100%" border="0" cellpadding="0" cellspacing="0"&gt;
                          &lt;tbody&gt;
                              &lt;tr&gt;
                                  &lt;td align="center" style="margin-top:16px;padding:8px 16px 8px 16px;background-color:#5091cd;border-radius:2px"&gt;
                                      &lt;a href="#" style="font-size:15px;letter-spacing:.04em;color:#ffffff;text-transform:uppercase;text-decoration:none;display:block;text-align:center;max-width:600px;overflow:hidden;text-overflow:ellipsis"&gt;
                                          Go to platform
                                      &lt;/a&gt;
                                  &lt;/td&gt;
                              &lt;/tr&gt;
                          &lt;/tbody&gt;
                      &lt;/table&gt;
                  &lt;/a&gt;
              &lt;/td&gt;
              &lt;td&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>The expected result is:</p>
  
  <p><img src="https://i.gyazo.com/a77c8bacd6b1949d36b4cd89fdfa02c3.png" alt=""></p>
  
  <p>The actual visualization:</p>
  
  <p><img src="https://i.gyazo.com/df454c4e5b6b6f81b7ac508ac8f00886.png" alt=""></p>