Gradients in Css

Tiled gradient images can be used to add depth and visual interest, without sapping
resources (the example’s image is under 2 KB in size). The depicted example is based on
the page from the “Drop shadows” section. The changes are an amendment to the background
pair in the #wrapper rule, tiling the gradient image horizontally on the wrapper’s
background, and new padding settings, so the text doesn’t appear over the gradient.
#wrapper {
padding: 36px 18px 18px;
background: #ffffff url(background-gradient.gif) repeat-x;
width: 500px;
margin: 0 auto;
}