Multiple backgrounds with CSS3

CSS3 allows for multiple background images on one element. To do this, you can separate backgrounds by commas, like this:

background: url(body-top.gif) top left no-repeat,
url(banner_fresco.jpg)  top 11px no-repeat,
url(body-bottom.gif) bottom left no-repeat,
url(body-middle.gif) left repeat-y;

Here’s an example of what this looks like. It allows, with the code above, for the same layout as this page with just 1 div.

The only browser projects having this feature implemented so far are WebKit and KHTML (Konqueror). This got into Safari 1.3 though, and works in OmniWeb 5.5 and up.

Type rest of the post here