Body Background Images In Safari

I think that it’s sort of ironic that Apple, known for making computers that “just work” and are rather forgiving with it comes to user error, would make a Web browser that is very particular and less forgiving when it comes to displaying XHTML and CSS Web sites.

As it turns out, in order to display an image in the body tag of a Web site using CSS, you must first make sure you order your rules accordingly. That order is as follows:

  1. Color (#000000, for example)
  2. URL of image
  3. Whether or not it repeats (no-repeat, repeat-x or repeat-y)
  4. It’s position along the x-axis (left, center or right)
  5. It’s position on the y-axis (top or bottom)

An example of this would look something like this:

body {
background: #000000 url(../images/bg.jpg) no-repeat center top;
}

Leave a Reply