CSS sprites repeatable

CSS sprites Wiki says:

To reduce the number of requests the browser makes to the server, some web designerscombine numerous small images or icons into a larger image called a sprite sheet

You can read advantage of CSS sprites here. Example of CSS sprites can be found here.

Background: Now the catch we had was while using CSS sprite to create repeatable image effect. When we increased width using css we saw the adjacent image repeating.

Solution: We used a single image vertical css sprite: image source.

Complete solution in here.

Happy Programming!

Leave a comment