[Webkit-unassigned] [Bug 69214] New: Font rendering issue when using opacity in CSS with Google Web Fonts

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=69214

           Summary: Font rendering issue when using opacity in CSS with
                    Google Web Fonts
           Product: WebKit
           Version: 528+ (Nightly build)
          Platform: Macintosh Intel
               URL: http://jfc.winworldblog.com/
        OS/Version: Mac OS X 10.7
            Status: UNCONFIRMED
          Severity: Normal
          Priority: P2
         Component: New Bugs
        AssignedTo: webkit-unassigned at lists.webkit.org
        ReportedBy: ultimatelifeform22 at gmail.com


Ok, so I've found this bug on both Ubuntu 11.04 running Chrome 14 and Mac OS X 10.7 running the latest nightly build of WebKit (latest as of today, being October 1, 2011. http://www.webkit.org/quality/bugwriting.html reports WebKit 535.6+).

So I use Google Web Fonts a good bit when I'm designing a website, and for the past two websites I've created I have had a lot of problems with them and the opacity CSS property under any WebKit based browser. Here's a look at my CSS code so you know what I'm talking about: 

#navbar a {
    font-family: 'Tangerine', cursive;
    font-size:40px;
    color:black;
    text-decoration:none;
    opacity: 0.5;
      -webkit-transition: opacity .25s linear;
      -moz-transition: opacity .25s linear;
      -o-transition: opacity .25s linear;
    margin:12px 16px;
    display:inline-block;
}
#navbar a:hover {
      opacity: 1;
}

What usually happens is one section of a character gets cut off until you hover over the element and allow it to fade in. When that happens the rest of the character comes up on the screen. I started fiddling with '#navbar a' in Element Inspector and set the opacity to 'opacity: 1;" and the issue obviously goes away. I checked under Gecko-based browsers and the issue didn't exist, and I also ran it through the W3C CSS Validator. It isn't my code.

I set up an example page that you all can access by going to http://jfc.winworldblog.com/. You'll see the issue on "Gallery" and "Contact" links. 

To a designer, it's a serious problem because it really looks terrible. Thanks for your time, and I hope this can be fixed soon. =)

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.