title: How to prevent Webkit text rendering change during CSS transition
body: <p>I'm using CSS transitions to transition between CSS transformed states (basically transitioning the scale of an element). I notice that when the element is transitioning, the rest of the text on the page (in Webkit) tends to slightly alter its rendering until the transition is done. </p>
  
  <p>Fiddle: <a href="http://jsfiddle.net/russelluresti/UeNFK/" rel="noreferrer">http://jsfiddle.net/russelluresti/UeNFK/</a></p>
  
  <p>I also noticed that this does not occur on my headers, which have the <code>-webkit-font-smoothing: antialiased</code> property/value pair on them. So, I'm wondering, is there any way to have the text maintain its default look (the "auto" value for font-smoothing) and not alter rendering during a transition.</p>
  
  <p>I've tried explicitly setting the text to use the "auto" value, but that doesn't do anything. I should also note that setting font-smoothing to "none" also prevents the rendering blink during transition.</p>
  
  <p>Any help is appreciated.</p>
  
  <p><strong>Edit 1</strong></p>
  
  <p>I should note that I am on OS X. While looking at my test in Chrome on Parallels, I did not see the two different paragraphs behaving differently, so this may be an issue exclusive to Macs.</p>