I would like to create a sprite with several images that will be used as background. Some of them will be used with norepeat and some will have repeat-x.
What's the best way to setup such styles?
So far I've tried this but it does not work properly:
background-position: 0 0;
<div class="sprites bg">
Is this even possible?
I think the best way to go for this is to separate the nonrepeated Bgs from repeated ones. put all norepeated bgs in one sprite image. For repeated ones, you can only put them together if they have the same width, and you have to place them vertically.
If you will only be repeating in the x-direction, make sure you place the images vertically. That is, don't place two different images side-by-side.