How to specify starting position for CSS linear gradient

[root44]

Hi,

I have a a graphic that's 600px wide. I would like to have a CSS gradient start from the end of my picture (600px in from the left) and fade out to the width of the screen. I'd like this because it will give the effect of my banner graphic dynamically taking up the width of the screen.

I have a problem though. The syntax for linear-gradient seems to not have an explicit way of specifying the starting position. It seems to only allow you to write left, or left top, or a type a number specifying the gradient direction...

Can anyone give me some tips on how to achieve this effect?

Thanks so much for your time,
Frank.

[JefferyJamison]

HI ! i have one example. i hope it will help you.

div {
background-image: -moz-linear-gradient(360deg,rgb(255,255,255) 25% ,rgb(241,123,25) 75%);

-pie-background: linear-gradient(360deg,rgb(255,255,255) 25% ,rgb(241,123,25) 75%);
behavior: url(/PIE.htc);
}

[webdevs]

Hello, I think below code will work as you are looking here CSS gradient.

#linearBg1 { /* fallback */ background-color: #1a82f7; background-image: url(images/linear_bg_1.png); background-repeat: repeat-y; /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, left top, right top, from(#1a82f7), to(#2F2727)); /* Safari 5.1, Chrome 10+ */ background: -webkit-linear-gradient(left, #2F2727, #1a82f7); /* Firefox 3.6+ */ background: -moz-linear-gradient(left, #2F2727, #1a82f7); /* IE 10 */ background: -ms-linear-gradient(left, #2F2727, #1a82f7); /* Opera 11.10+ */ background: -o-linear-gradient(left, #2F2727, #1a82f7); }

[root44]

Hi,

Thanks for the responses! I decided to use the "length" parameter to make my gradient extend to the end of my image in one colour, and then fade out.

background-image: -webkit-linear-gradient(left, #76a6ae, #76a6ae 600px, #c7d5c8);
/* And similar stuff for the -moz, -ms, -o variants... */

Thanks for the help,
Frank.