Using background-position: with repeat-y

This gray 500px tall no-repeat image is shifted 10px left to show the repeating image painting behind it.

The green 37px tall repeat-y image starts at 500px down but paints in both directions on the y-axis.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

Some demo filler text to fill the space.

⇐ End reverse repeat