Recipe 3.4. Creating a Line of Background Images

Problem

You want a series of background images to repeat vertically or horizontally.

Solution

To tile the background image horizontally, or along the x-axis, use the following CSS rule (see Figure 3-6):

body {  background-image: url(bkgd.jpg);  background-repeat: repeat-x; }             

Figure 3-6. The background image tiled horizontally

To have the background image repeat along the vertical axis, use the repeat-y value for background-repeat.

See Also

Recipe 3.5 for placing a background image at a specific location in a web page.