css3 - Is it possible to use a gradient over a css background image? -

i trying div have blue background image 500px wide. trying gradient white @ left of div , goes right background image visible

this css code useful make gradient

.gradient {     width: 200px;     height: 200px;      background: #999; /* non-css3 browsers */      filter: progid:dximagetransform.microsoft.gradient(startcolorstr='#cccccc', endcolorstr='#000000'); /* ie */     background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#000)); /* webkit browsers */     background: -moz-linear-gradient(top,  #ccc,  #000); /* firefox 3.6+ */  } 

use above css in html using class

<div class="gradient">     gradient box </div>