I have this sprite and i need to repeat-x each color. Is it possible?
You should be able to repeat them as you wish if you change the image so that the red stripe appears below the green stripe. Other wise the repeat will show both colours alternating across the width of the image ;)
Just make sure each stripe is the correct height for the element it will be the background image for...
You can't repeat part of an image, so to use repeat-x you have to make the color span the entire width of the image.
You should consider making the image some pixels wider. If it's too narrow the browsers can have problems using it as a background. I've seen that with a 1x1 pixel background image, where it faded out to transparent instead of showing a solid color.