I wanted to implement a background image that has a greater width than the main content area.
Yet I also needed a repeating image bahind that single background image as depicted in this image:
As you can see the background image extends beyond the browser windows horisontally (thus potentially overflowing the body element).
Initially the repeated background behind this image was the background-image property of the body, and the singluar background image was the background image of a div which was centered. In every onfiguration of this type if the singular background image was visibly extending beyond the horizontal width of the body (the browser window) a horizontal scrolbar would appear. This scroll bar is only nessassery once the grey box (content area) extends out of the body.
The only sollution I have come up with is to have the repeating background image as the background-image (top left repeat-x) to the html element, and the singular image as the background-image (top center no-repeat) of the body element. I have not seen this done anywhere else and it seems to work in Safari/Firefox (not sure about IE yet).
So my question is really is there some unwritten rule that the html element should not have a background image in this way.