Mark Best

One of the requests that came in during the WASP feedback discussions was for image “sprites”: for the ability to take a slice of an image and use it, e.g., as a background image. This would allow lots of decorative graphics to be placed in the same file. Image slices like this are actually on the CSS Working Group’s radar; the idea’s been floating around for quite awhile, and we’ve added a placeholder for them in the new CSS3 Image Values draft.

So I wanted to gather some feedback on what syntax would be most useful to you. The restriction is: the syntax must be usable as a value for any property that takes images. That is, you can’t suggest new properties. It has to be something that can be used as the value for any of background-image, list-style-image, content, border-image, etc. Bonus points for explaining why your proposed syntax is more convenient than any others.

A few ideas to start (feel free to add your opinion on these):

• image-slice("image.png", X, Y, W, H) Advantage: dead simple.
• url("image.png#xywh=X,Y,W,H") Advantage: can be used other places like <img src="...">, browser address bar, etc.