Single gradient to multiple images

Question

I would get this result: image

the images will be cropped in PNG without background and and black color, like the gradient in separate images its possible with CSS ?

Answer 1

You're going to need to place the images inside of a div and then style the div's background with the desired gradient. For example:

HTML

<div id="gradient">
    <img src="..." /><img src="..." /><img src="..." />
</div>

CSS

#gradient {
    width: 300px; //Whatever the total width of the images is
    height: 61px; //Whatever the height of the images is
    ...  //Gradient CSS goes here
}

Here is a fiddle showing it in action: http://jsfiddle.net/2aHHu/