Msg#: 4322731 posted 2:21 pm on Jun 9, 2011 (gmt 0)
Unfortunately you are right - background-images repeat in full, not parts or "slices". I've looked at this several times since you posted the question, but nothing has occurred to me yet. That includes thinking about some of the options available in the css3 "Backgrounds and Borders" module. There has been some discussion about adding a "background-image-slice" property that would do what you want, but no developments on that yet.
So not an ideal response - but a fascinating challenge. Can anyone else think of another approach?
Msg#: 4322731 posted 5:12 pm on Jun 9, 2011 (gmt 0)
Well, that would depend on what you were trying to do :)
I may have been incorrect, because I read "collection of images" as a collection similar to below - of the sort used by amazon.com which is a common example. ||||||||||||||||||||||||||||| ||####|||****|||^^^^^|| ||####|||****|||^^^^^|| |||||||||||****|||^^^^^|| ||%%||~~~~|||||^^^^^|| ||%%||~~~~|||||||||||||||
- and the goal was to repeat just one of those images horizontally and vertically across the background of any element.
The technique you described is different because the image "collection" is specifically prepared to suit the element's width/height and the element is sized according to the width/height of the image that will be visible.
As you say, that has limitations, but I got some interesting results using the before and after pseudo elements - although that defeats the purpose if sprites are being used to reduce server hits. There is also the technique of making the dimensions of the image collection large enough to avoid other images being visible, and/or "layering" multiple backgrounds to create the repeating effect - with the obvious disadvantage of increased image size, therefore increased bandwidth consumption, and/or increase hits as well.
Was this a general question, or did you have a specific code situation in mind? I ask because although the above aren't suitable as general solutions, it might be possible to think of a technique to achieve the desired outcome if you provide a bit more detail.
Msg#: 4322731 posted 6:54 pm on Jun 9, 2011 (gmt 0)
You were correct in the manner I was using this - one single 'collection of images' which would be used on most pages.
So, basically the only thing I could do is have a seperate image file for certain background repeat images... I might play around with it later today and will post some results, however, combining two or three images that repeat into one would not be a very huge savings...