RichInStyle.com tests: background-position

Repeat position test

The above two elements should look almost exactly the same - the backgrounds should be the same width, but the second one should have its stars to the right (although it might look like it is to the left) of the first - each star will have the same y-coordinate but a different x one.
With the examples above, the difference is that each star has the same x-coordinate, but a differerent y-coordinate.

The above two elements should look exactly the same - the backgrounds should be the same width, but the second one should have its stars to the right (although it might look like it is to the left) of the first - each star will have the same y-coordinate but a different x one.
With the examples above, the difference is that each star has the same x-coordinate, but a differerent y-coordinate.

With the example above, the background should be the same width as this one, but it shouldn't be as high as the available space - there will be white space around it.

The two examples above should differ only in the position of the stars on them - the backgrounds should both the same height and width.

The following element should have the stars centered at the top of the P (background-position: top specified, therefore center used for other value:
The following element should have the stars aligned with the middle right of the element:
The following element should have the stars placed at the vertical middle of the element, 3cm from the left of the element:
The following element should have the stars placed at the vertical middle of the element:
The following element should have the stars placed 3cm from the left of the element and 10% down (lengths and % may be mixed):
The following element should have a transparent (white) background - bottom 3cm specified, but an invalid value (can't mix lengths with length keywords), so the whole declaration should be ignored:
The following element should have the image flush with the bottom right of the element: