私はこの記事http://www.sitepoint.com/using-unprefixed-css3-gradients-in-modern-browsers/を読んでいました。この記事が教えていることのこの小さなデモを作成しました。
<html>
<head>
<title>Css Gradients</title>
<style>
.demo{
height: 200px;
width: 400px;
margin-bottom: 10px;
background: linear-gradient(to right,red,yellow);
/*background: linear-gradient(23deg,red,yellow);*/
}
#radial{
/*background: radial-gradient(at center,red,yellow);*/
background: radial-gradient(circle closest-corner,red,yellow);
}
</style>
</head>
<body>
<div class="demo"></div>
<div class="demo" id="radial"></div>
</body>
</html>
問題は、Firefox では背景のグラデーションが正しくレンダリングされているのに、Google Chrome (バージョン 22) では背景のグラデーションがまったくレンダリングされないことです。スクリーンショットを参照してください。