WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
UNCONFIRMED
97294
Radial Gradient issue when body's position is absolute
https://bugs.webkit.org/show_bug.cgi?id=97294
Summary
Radial Gradient issue when body's position is absolute
Deveedutta
Reported
2012-09-20 22:51:36 PDT
body#app_splash { background:url(../images/glass.png), -webkit-gradient(radial, center center, 0, center center, 123, color-stop(0%, rgba(239, 248, 255, 0.7)), color-stop(20%, rgba(255, 255, 255, 0.59)), color-stop(100%, rgba(255, 255, 255, 0))),#99CDF4; background:url(../images/glass.png), -webkit-radial-gradient(center center, circle contain, rgba(239, 248, 255, 0.7) 0%, rgba(255, 255, 255, 0.59) 15%,rgba(255, 255, 255, 0.1) 70%, rgba(255, 255, 255, 0) 100%),#99CDF4; background-position: right top, 0 0; background-repeat:no-repeat; text-align:center; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; color:#fff; /*position:absolute;top:0; left:0; bottom:0; right:0;*/ margin:0; padding:0; border:0; line-height:1; text-rendering:optimizeLegibility; } If you un-comment the "position:absolute;top:0; left:0; bottom:0; right:0;" portion, the radial gradient disappears. Initially I assumed it to be an issue with the position, but later it became convincing that it is a bug. glass.png is a 700x400px semi-transparent PNG image, used to render a glass-shine in the page.
Attachments
Add attachment
proposed patch, testcase, etc.
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug