Alt-Web Design & Publishing
CSS3 Demo - One Division with Multiple Background Images

3 Image Slices

from a Photoshop™ comp

top

middle

bottom

CSS3 Code

#wrapper {
text-align:center;
margin:0 auto;
width: 1025px;/*image width minus padding if used*/
background: url(bottom.jpg) bottom right no-repeat,
url(top.jpg) top left no-repeat,
url(middle.jpg) left repeat-y,
#FBFBFB;}
/* NOTE: Stacking order matters. Topmost definitions have priority over bottommost. If an image is not visible, try moving it higher up the list. A background color was added last for devices that may have images turned off.*/

Html Code

<div id="wrapper">
<p>Some text goes here.</p>
<p>Some more text goes here.</p>
</div>