background-position

Does x or y come first? And another bug.

[thesheep]

So if I have

background-position: 10px center;

Will the 10px apply to the x or y axis? I'm assuming that center can be either a vertical or horizontal center (or should it be 'middle' for vertical?).

And there's a bug I found in Safari, which others have mentioned. It's sensitive to whether the 'no-repeat' value goes before or after the position values if you use the background attribute:

background: red url(image.gif) no-repeat top left;

apparently works but not

background: red url(image.gif) top left no-repeat;

[jetboy_70]

x, y and then your repeat value, although you can swap around the x and y if you're using keywords (left, top etc.).

Don't mix length/percentage values with keywords on the same element (so no background-position: 10px center;). IE and Mozilla will forgive you, but Opera will kick your ass for it (as I've just learned the hard way).

The full spec is at:

[w3.org ]

[thesheep]

Oh OK. I see from your link that I could have

background-position: 50% 10px;

and that would be the same meaning as "center 10px" anyway. So it should work in Opera?

I also noticed Safari seemed to have problems with negative length values.

[jetboy_70]

So it should work in Opera?

I've been using '25px 100%' and that's fine in Op 5, 6 and 7.5 under Windows, so you should be okay.