Bug 97294

Summary: Radial Gradient issue when body's position is absolute
Product: WebKit Reporter: Deveedutta <deveedutta>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: UNCONFIRMED ---    
Severity: Normal    
Priority: P4    
Version: 528+ (Nightly build)   
Hardware: Other   
OS: Windows 7   

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.