div.containerA {
position:relative;
top:0px; left:40px;
background:#999 
   url(purpletile.jpg) repeat;
width:350px;
height:100%;
padding: 20px;}

Shadows are:
div.box1 {
position:absolute;
top:0; left:0;
width:15px;
background:black 
  url(backgroundleft.gif) repeat-y; 
height:100%;
}
	
div.box2 {
position:absolute;
top:0; right:0;
width:15px;
background:black 
  url(backgroundright.gif) repeat-y;  
height:100%;
}

In FireFox, both columns have shadows running the entire length of the container div.
The container divs expand to hold the content <p>'s. .box1 and .box2 hold the shadow imgs and tile nicely.

IE tiles the shadow boxes only to the height of the browser window.
Container divs expands to the content <p>'s

div.containerB {
position:absolute; /**/
top:0px; left:450px;
background:#999 url(purpletile.jpg) repeat;
width:350px;
/*** no height set ***/
padding: 20px;}


Shadows are same classes