title: -webkit-text-size-adjust: none; not working on iPhone
body: <p>I'm creating an html esignature. Despite the same styles being applied to all of the text there is still ONE line of text the the iPhone keeps enlarging. I've read that -webikit-text-size-adjust: none; should prevent this but it is not working. Here is my code for this particular table cell.</p>
  
  <pre><code>&lt;td valign="bottom" class="tag" style="display: block; width: 280px; height: 18px; padding-right: 6px; padding-top: 2px; text-align: right;"&gt;
  &lt;a style="font-family: Arial; font-size: 11px; line-height: 20px; font-weight: 500; color:#585859; white-space: nowrap; -webkit-text-size-adjust: none;"&gt;branding &lt;span style="color: #db1e17;"&gt;|&lt;/span&gt; communications &lt;span style="color: #db1e17;"&gt;|&lt;/span&gt; interactive&lt;/a&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>In my media query above specifically for iPhone my code is this:</p>
  
  <pre><code>@media screen and (max-device-width: 480px) and (max-device-height: 320px), screen and (max-device-width: 320px) and (max-device-height: 480px){ 
  td.tag {
  width: 136px !important;
  height: 7px !important;
  padding-top: 2px !important;
  padding-right: 3px !important;  
  }
  
  td.tag a{
  font-size: 5px !important;
  line-height: 9px !important;
  -webkit-text-size-adjust: none;}
  </code></pre>
  
  <p>Can you see what I could be doing wrong?</p>