The current CSS3 recommendation (the be exact this candidate version) gives new possibilities for positioning background-images, that may prove very useful when working with CSS sprites.

I am particularly interested in the possibility to bottom position the background while also adding an offset (from the bottom of the image), so this:

#container {
  background-image:url(sprite.png);
  background-position:bottom -100px left 0;
}

would take my sprite.png image, stick it to the bottom of my #container element and then drag it down by 100 px so that the bottom 100 px of that image will not show. the image would then fill up from the bottom as high as the #container is.

This works fine in Chrome (Version 29.0.1547.76 m), Firefox (24.0) and IE10. But I cannot test on IE9. Does IE9 support this new syntax?

I have an old Windows XP machine on which I can test in IE8 and it definitely does not work.

Edit

I have had the opportunity to do some tests and I can confirm that it works in IE9 (tested in Win7 Pro 32bit)

许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top