1. Open the
user_styles.css
file, and scroll to the bottom to show the.sideblock .content
style definition.2. Add the following line of CSS to the bottom of the
.sideblock .content
class, in order to load the content background.background:#dddddd url(blockcontentback.gif) repeat-x center top;
The
repeat-x
element means that the background image is repeated horizontally across the page—which is how the thin slice that we created the background image from fi lls the whole width of the sideblock.3. Save the file, and then refresh your browser window.
In the last, simple exercise, you changed the CSS code in your user_styles.css
file to load the gradient background that you created for the content area of the sideblocks. As you can see, some of the smaller sideblocks haven't got this background, for the reason explained earlier. If you can't see the results, make sure that you are logged in as the administrator and...