RESOLVED DUPLICATE of bug 9145490698
[chromium] Radial gradients are drawn incorrectly on divs without borders
https://bugs.webkit.org/show_bug.cgi?id=90698
Summary [chromium] Radial gradients are drawn incorrectly on divs without borders
vollick
Reported 2012-07-06 12:05:54 PDT
Try the following example. The gradient should be centered in the div, but it's centered on the lower right corner. However, when you hover over the div, a border gets added and the gradient jumps to the correct spot. It appears that an extra scale is getting applied at some point. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Poster Circle</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css"> div:hover { border-style: solid; border-width: 1px; border-color: #AA8888; } div { background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 60, from(#444444), to(#CCCCCC)); height: 200px; width: 200px; } </style> </head> <body> <div></div> </body> </html>
Attachments
Rick Byers
Comment 1 2012-07-26 07:40:13 PDT
*** This bug has been marked as a duplicate of bug 91454 ***
Note You need to log in before you can comment on or make changes to this bug.