Webkit bug YAY!
So this is somewhat interesting. Here’s the skinny:
- Let’s say you’re using a WebKit-based browser.
- Let’s also say that you’re mucking around with a little
@font-face
, along with a few other CSS shinies. - Now, let’s also also say that you’re mucking around with
-webkit-transition
, a less-than-standard but still somewhat sexy stylesheet property—specifically, you’re applying a CSS transition to a link when the user hovers over it.
What’s the result? Well, if you’re hovering over the link while your text is being resized, it looks something like this:
So in short, -webkit-transition
and @font-face
produce a weird, freaky love child visual bug if you’re hovering over a link and resizing your text. The text will temporarily revert to the next non-@font-face
font in the stack—Helvetica above—before re-applying the proper typeface.
Which, yes, I realize probably nobody will do. Still, I think it’s kind of an interesting little tic. Plus, it affects all WebKit-based desktop browsers I tested on, notably Safari and Chrome. Remove the @font-face
assignment or the -webkit-transition
, and the bug goes away.
Granted, it’s no systemic rounding error, but hey: what is?
∞
∞
∞
∞