Stack Overflow
Stack Overflow

Questions tagged [css-sprites]

CSS Sprites is a CSS technique to combine small images into one big image and then access them using the background-position property. It is used to save HTTP requests.

CSS Sprites is a CSS technique to combine small images which are used as background-images into one big image and then access them via using offset. It is used to save HTTP requests and additionally in many cases the combined image's filesize is smaller then the sum of all small image's filesize.

For example google.com is using a CSS sprite:

enter image description here

Read more about this technique:

There are also numerous CSS Sprite generators on the web.

FAQs

863 questions
-1
votes
1 answer

Generate HTML background from sprite

I have a sprite sheet that I want to create a background from, but I want to generate it randomly from separate parts of the sheet. I'd rather not generate a full-sized image each time, as I don't want to have to store one for each session, can…
rbrtl
  • 791
  • 1
  • 6
  • 23
-2
votes
1 answer

why do sprites not work with a general background?

So for my website hostup I tried to add sprites since I had over 25 images and google pagespeed complained. I solved my sprire not displaying issue, but I am not sure why. Why is it that you have to load the image in each and everysprite, to waste…
Davh
  • 29
  • 1
  • 7
-2
votes
2 answers

Image sprites for website

Is it better to use image sprites for CSS or use a lot of different image files? Maybe it is better to use a lot of different images rather than one sprite or vice versa?
Sergejs Visockis
  • 123
  • 1
  • 4
  • 8
-2
votes
1 answer

Using CSS Sprites as Buttons & jQuery

my partner gave me a job to do because he wants me to learn jQuery. I'm making a section of our landing page that has three buttons that replace the content for each button. I've got that down (at least the basic function) but I need some help…
user3727569
  • 29
  • 1
  • 1
  • 5
-2
votes
2 answers

How to make sprite-images change on hover different items?

I have a sprite of 8 images. What I want to do is this: if someone hovers over a sub-menu list (let's say item 1), then the sprite image, which is layed on a different div, has to change. So the sub-menu item and this div with the sprite are related…
user1717526
  • 131
  • 1
  • 2
  • 14
-3
votes
2 answers

Position of sprite icons in CSS

This is my sprite image, the icons are 64*64 (total 64*384) in dimension. I'm trying to display the icons but only one/the first one works. I am new to this CSS Sprite thing. So looking for help/guide. #Accommodation { width: 64px; …
Sourav
  • 17,065
  • 35
  • 101
  • 159
-3
votes
1 answer

Cant see my sprite in drop down

Hi guys I am trying to view my sprite instead of the actually arrow that drops down.... I can see my sprite on my index.html with certain elements of it and when I set my sprite to the body I an see it as well. Direct link to sprite…
ryanh
  • 9
  • 2
-3
votes
2 answers

Css background position coordinates

I want to make css sprite with this image My html codes;
And css codes; .left{ background : url(arrw.png) no-repeat 0…
midstack
  • 2,105
  • 7
  • 44
  • 73
1 2 3
…
57
58