I’m currently evaluating the use of CSS sprites to reduce the number of individual images on my website, hence the necessary number of http requests. In my case, these images are mostly various types of icon buttons (e.g. for links to social media sites such as Facebook and Twitter. Rollover effects do not play.
I have searched this site and looked at some examples such as the one on the blog of A Kist Apart. Most of what I’ve found uses an <ul> with a background image (the sprite) and then positions the <li> items relative to that background image.
However, in my case, I have situations that look like:
[clickable image] [some static text] [clickable image] [some static text]
And I am wondering whether in such situations, these things are still workable. At least, I did not manage to get it working.
So, has anyone an opinion on this? Can it be done and is it worth the effort? Examples of how it can be done?
Your code
Examples of how it can be done?
You need to show us examples of what you're trying to do before we can show you examples of how it can be done.
Look at Google. Most of the
Look at Google. Most of the images on their pages are just a small part of one giant image.