Demo of Gradient dissapearling on long div in Chrome
HTML
<!--
Visible in Chrome for Windows ver 28.0.1500.37 beta-m
Setting #contained height to 32767px or less solves the issue.
Also removing the border (setting width to 0,
or removing border-style: solid rule)
-->
<div id="container">
<div id="contained"></div>
</div>
CSS
#container {
background-color: #000;
width: 200px;
}
#contained
{
height: 32767px; /* > 32767px */
width: 200px;
background-color: #fff;
background: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#D7DBDF),color-stop(30%,#fff));
background: -webkit-linear-gradient(top,#D7DBDF 0%,#fff 30%);
background: linear-gradient(top,#D7DBDF 0%,#fff 30%);
border-style: solid;
border-color: red;
border-width: 0;
border-width: 1px;
}
.inner {
width: 100%;
height: 200px;
border-top: solid 1px #aaa;
}