CSS Gradient doesn't work in Chrome with long divs

[Dani]

Using a CSS background gradient and, in Chrome, it just shows up as solid black if the div is greater than 32,000 pixels.

background-color: white;
background-image: -webkit-linear-gradient(top, #EEE9F0 10%, white);
background-image: -moz-linear-gradient(top, #EEE9F0 10%, white);
background-image: -ms-linear-gradient(top, #EEE9F0 10%, white);
background-image: -o-linear-gradient(top, #EEE9F0 10%, white);
background-image: linear-gradient(to bottom, #EEE9F0, white);

Here's a live example (http://www.daniweb.com/software-development/c/threads/334260/a-simple-tic-tac-toe-c-programming) until/unless I find a solution.

[Dani]

I was able to come up with a not-so-elegant workaround that involves creating a dummy div and having the gradient render in that, so it's not dependent on the height of the post.

However, I still can't find a CSS-only workaround to the bug.

[Dani]

Incidentally, my ideal solution would be to degrade nicely if it can't show the gradient instead of fill in as a solid black background.

[bradly.spicer]

Have you tried doing this:

background-color: #ff0;
background-image: #ff0 -webkit-linear-gradient(top, #EEE9F0 10%, white);
background-image: #ff0 -moz-linear-gradient(top, #EEE9F0 10%, white);
background-image: #ff0 -ms-linear-gradient(top, #EEE9F0 10%, white);
background-image: #ff0 -o-linear-gradient(top, #EEE9F0 10%, white);
background-image: #ff0 linear-gradient(to bottom, #EEE9F0, white);

Try setting a base color first? Not sure if it works :P

[Dani]

I think you're confusing the background property with the background-image property. Background-image can't set a base color.