Re: background-position-x & y

On Wed, Jan 14, 2009 at 22:08, L. David Baron <> wrote:
> On Wednesday 2009-01-14 12:41 -0800, fantasai wrote:
>> Agreed. sprite() is much preferable to extending url().
> I'm not sure "sprite" is really what we want to call it.  Maybe
> "image" or "image-region"?
> Anyway, my previous proposal from the last time this came up is in

I see one possible drawback to this approach. Doing sprites now, you
typically only define the background image URI once, and only need to
specify the background-position property for all the alternatives
(e.g. see the first post in this thread:

Would such inheritance still be possible using this function notation?
For example:

/* top-left 10x10 sprite is the default: */
li { background-image: sprite(url(foo.png), 0px, 0px, 10px, 10px); }

/* 2nd and 3rd 10x10 sprites in first row for special cases: */
li#one { background-image: sprite(inherit,10px, 0px, 20px, 10px); }
li#two { background-image: sprite(inherit, 20px, 0px, 30px, 10px); }

/* hover states in second row: */
li:hover { background-image: sprite(inherit, inherit, 10px, inherit, 10px); }

The order of the coordinates I used is x-start, y-start, x-end, y-end,
for no particular reason. The exact syntax isn't important (and can
hopefully be improved upon), I just hope my intention is clear.


Received on Tuesday, 20 January 2009 01:19:40 UTC