Как сделать корректно скругления + градиент - Вопросы по CSS

Использую класс для одновременного задания скуглений и градиента:
.radius1 {
 border: 2px solid #CCC;
 width: 1000px;
 background:#FFF;
 /*скругления:*/
 border-radius:5px;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 /*градиент:*/
filter: progid:DXImageTransform.Microsoft.gradient(enabled='true',startColorstr='#fee183', endColorstr='#ffffff',GradientType=0); /* for IE */
 background: -webkit-gradient(linear, left top, left bottom, from(#fee183), to(#ffffff)); /* for webkit browsers */
 background: -moz-linear-gradient(top, #fee183, #ffffff); /* for Firefox 3.6+ */ }

В итоге градиент выходит за границы скругления в виде прямоугольной области.
как это можно исправить?

Здесь оптимальнее использовать графику,а не CSS )

а без картинок можно?