Połączenie gradientu i obrazka w jednym elemencie

[Mdx91]

Czy jest jakiś sposób żeby połączyć gradient (w css) i obrazek tła w jednym elemencie?
 
Przeszukuje internet i wszystko co znajdę nie działa.
 
Próbowałem już:

background-image: -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0, #000000),
	color-stop(1, #8A868A)
), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -o-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -moz-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -webkit-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: -ms-linear-gradient(top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;
background-image: linear-gradient(to top, #000000 0%, #8A868A 100%), url({style_images_url}/maintitle.png) no-repeat right;

background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0, #000000),
	color-stop(1, #8A868A)
);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -o-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -moz-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -ms-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, linear-gradient(to top, #000000 0%, #8A868A 100%);

background-image: url({style_images_url}/maintitle.png) no-repeat right;
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #000000),
    color-stop(1, #8A868A)
);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -o-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -moz-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -ms-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, linear-gradient(to top, #000000 0%, #8A868A 100%);

background-image: url({style_images_url}/maintitle.png) no-repeat right, -webkit-gradient(
	linear,
	left bottom,
	left top,
	color-stop(0, #000000),
	color-stop(1, #8A868A)
);
background-image: -o-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: url({style_images_url}/maintitle.png) no-repeat right, -moz-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: -webkit-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: -ms-linear-gradient(top, #000000 0%, #8A868A 100%);
background-image: linear-gradient(to top, #000000 0%, #8A868A 100%);

 
 
 
Efekt jaki uzyskałem to albo całkowity brak tła, albo gradient bez obrazka.
 
Z góry dzięki za pomoc

[tenechu]

Spróbuj tego:

html{
background-image: -webkit-gradient(
linear,
left bottom,
right top,
color-stop(0.31, rgb(227,227,227)),
color-stop(0.66, rgb(199,199,199)),
color-stop(0.83, rgb(184,184,184))
);
background-image: -moz-linear-gradient(
left bottom,
rgb(227,227,227) 31%,
rgb(199,199,199) 66%,
rgb(184,184,184) 83%
);
height:100%
}
body {
background: url(../_img/picture.png);
height:100%
}

Podobno działa, nie testowałem