Help with CSS - background extending to 100%

[stellargirl2012]

Hey, I'm having some issues with my background images in a page I'm making. I basically have two background images, left border and right border.. and I'm trying to make them repeat in the y direction and fill up 100% of the page. Seems simple enough, but it's not working....

Here is my code:

#EA19 {
 position:absolute; 
 right:0px; 
 top:331px; 
 width:70px; 
 height:100%;
 z-index:19; 
 background-image: url(images/EA2_19.gif); 
 layer-background-image: url(images/EA2_19.gif); 
 border: 1px none #000000;
 background-repeat: repeat-y;
}



#EA20 {
 position:absolute; 
 left:0px; 
 top:331px; 
 width:140px; 
 height:100%;
 z-index:-20; 
 background-image: url(images/EA2_20.gif); 
 layer-background-image: url(images/EA2_20.gif); 
 border: 1px none #000000;
 background-repeat: repeat-y;
}

Any help would be much appreciated. I'm attaching an image of what it looks like in the browser. Thanks.

Moderator: placed code in code-brackets.

[jeweline]

This article might help:

http://www.alistapart.com/articles/fauxcolumns/

Hey, I'm having some issues with my background images in a page I'm making. I basically have two background images, left border and right border.. and I'm trying to make them repeat in the y direction and fill up 100% of the page. Seems simple enough, but it's not working....

Here is my code:

#EA19 {
position:absolute;
right:0px;
top:331px;
width:70px;
height:100%;
z-index:19;
background-image: url(images/EA2_19.gif);
layer-background-image: url(images/EA2_19.gif);
border: 1px none #000000;
background-repeat: repeat-y;
}

#EA20 {
position:absolute;
left:0px;
top:331px;
width:140px;
height:100%;
z-index:-20;
background-image: url(images/EA2_20.gif);
layer-background-image: url(images/EA2_20.gif);
border: 1px none #000000;
background-repeat: repeat-y;
}

Any help would be much appreciated. I'm attaching an image of what it looks like in the browser. Thanks.