webs divine: design notes

Just like most web designers, we learn something new every day. Some of the insights are fairly simple, while others are more complicated. As we go along, WEBS DIVINE plans to share our tricks, hints and tips in Design Notes.

NO-REPEAT WEB BACKGROUND

Adding a tiled image as a web background can sometimes cause a continuous repeat of the image, making the page look confusing and unprofessional.

Repeating web background

The above image is named "scrollcandle.jpg." In order to stop the background image repeat, use the following CSS code (placing the name of your image in the brackets following url):

<style type="text/css">body{ background: url(scrollcandle.jpg) black center no-repeat fixed; } </style>

Using the code will allow the background image to display as follows:

No-repeat web background

The properties of the code can also be adjusted to fit the background of your web page. For example, "black center" can be changed to color and alignment suited to your needs.

Click here to see another sample of a no-repeat web background.

More Hints & Tips: