Bug 97294 - Radial Gradient issue when body's position is absolute
Summary: Radial Gradient issue when body's position is absolute
Status: UNCONFIRMED
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: Other Windows 7
: P4 Normal
Assignee: Nobody
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2012-09-20 22:51 PDT by Deveedutta
Modified: 2012-09-20 22:51 PDT (History)
0 users

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Deveedutta 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.