title: Background color on link in Outlook 2010 HTML email
body: <p>The background-color (in red) in this link is only being applied to the text, not the entire link.</p>
  
  <p>The link has padding too.</p>
  
  <p>This is for Outlook 2010.</p>
  
  <p>Does anyone know of a way to get the background-color to fill the link?</p>
  
  <p>Here is an image:</p>
  
  <p><img src="https://i.stack.imgur.com/S6L3l.png" alt="Outlook 2010 on Windows"></p>
  
  <pre><code>&lt;a href="#" class="btn" style="font-size: 13px; border: 1px solid #c5c4c4; color: #3c3c3c; padding: 7px 25px; display: inline-block; border-radius: 5px; font-weight: bold; text-decoration: none; background-color: red; background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); background: -o-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); background: -ms-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%); background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%);"&gt;
    Accept
  &lt;/a&gt;
  </code></pre>
  
  <p>Here is the css in readable format:</p>
  
  <pre><code>font-size: 13px;
  border: 1px solid #c5c4c4;
  color: #3c3c3c;
  padding: 7px 25px;
  display: inline-block;
  border-radius: 5px;
  font-weight: bold;
  text-decoration: none;
  background-color: red;
  background: -moz-linear-gradient(top,  #ffffff 0%, #e5e5e5 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5));
  background: -webkit-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%);
  background: -o-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%);
  background: -ms-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%);
  background: linear-gradient(to bottom,  #ffffff 0%,#e5e5e5 100%);
  </code></pre>