Position of background images on inline-level elements

- - - - - - 00 01 02 03 04 - - - - -

- - - - - - 00 01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 - - - - -

In the above test cases background images with different background positions are applied to inline elements (spans). When the elements wrap on multiple lines the resulting position is different in IE7-/Win with respect to other browsers. Nine different positions are tested using small (8px×8px) square images of different colors. The inline elements are the light gray ones, with numbers inside. The nine positions correspond to all the combinations of 0%, 50%, 100% for the two values (horizontal, vertical) of background-position.

CSS tests home