title: Same font renders differently across two Mac both running the same OS version and browser version
body: <p>The site I’m working on has a custom script link font, <a href="http://www.identifont.com/similar?3HB" rel="nofollow noreferrer">Santa fe</a> to be exact. On my Mac it renders in Firefox 5 as such:  </p>
  
  <p><a href="http://z17.me/oa2c+" rel="nofollow noreferrer">how it should render http://z17.me/oa2c+</a>  </p>
  
  <p>This is how I want it to render. </p>
  
  <p>On my client’s mac and a someone else’s Mac it renders (improperly) like:  </p>
  
  <p><a href="http://idzr.org/5ume" rel="nofollow noreferrer">improper rendering http://idzr.org/5ume</a></p>
  
  <p>I was having the same problem before in Safari, but <code>-webkit-font-smoothing: antialiased;</code> fixed it; however, it appears tat there is no equivalent of that for Firefox.</p>
  
  <p>I also have <code>text-rendering: optimizeLegibility;</code> on and generated the web font package using <a href="http://www.fontsquirrel.com/" rel="nofollow noreferrer">Font Squirrel</a>.</p>
  
  <p>Any ideas?</p>
  
  <p>Edit: The font has this CSS applied to it:</p>
  
  <pre><code>font-family: SantaFeLetPlainRegular;
  font-weight: normal;
  font-style: normal;
  font-size: 21px;
  text-transform: lowercase;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  /* @doubtful_existance: I don’t think these even exist? Can’t hurt much, I guess. */
  -moz-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  /* end @doubtful_existance */
  font-smoothing: antialiased;
  text-shadow: 0 0 1px rgba(256, 256, 256, 0.01); /* A trick I’ve heard of to fix issues like this. */
  opacity: 0.99; /* Another trick I’ve heard of to fix issues like this. */
  </code></pre>