[css-d] Color for three-column layout

[Iorhael]

Hi, I working on a three-column layout but having trouble setting the color for 
the left and right columns. I have been looking at several online tutorials and 
it appears that I'm doing the CSS right, but the images aren't coming in for 
the column backgrounds. When I put the background image for the left column in 
the body rule, it looks great, but when I move it to the #left rule, it doesn't 
come in. The image for the #right column doesn't come in regardless of where I 
put the image for the #left rule. 

I am using absolute positioning...is this something that requires using float 
instead?

http://www.drk-writing.com/3columnlayout/

body {
   margin: 0;
   padding: 0;
   text-align: center;
}

#banner {
   background-image: url(images/daisiesbanner.jpg);
   border-bottom: 10px solid #4B5957;
   padding: .5em;
}

#left { 
   position: absolute;
   top: 80px;
   left: 0px;
   width: 160px;
   background: #fff url(images/sidebar1.gif) repeat-y top left;
}

#right {
   position: absolute;
   top: 62px;
   right: 0;
   width: 190px;
   background-image: #fff url(images/sidebar2.gif) repeat-y top right;
   padding-top: 20px;
} 

#center {
   margin: 0 190px 0 190px;
   padding:  20px 20px 10px 5px;
   border-right: 1px solid #4B5957;
}

p {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 11px;
   line-height: 16px;
   color: #000;
   text-align: justify;   
} 

p.nav {
   border-top: 1px solid #4B5957;
   padding-top: 5px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #4B5957;
   text-align: justify;   
} 

h1 {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 30px;
   color: #fff;
   text-align: left;
   font-weight: normal;
}

h2 {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 16px;
   color: #374240;
   text-align: left; 
   margin: 0;
   padding: 0;     
}  

h3 {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 11px;
   color: #374240;
   text-align: left; 
   margin: 0;
   padding: 0;
   padding-top: 15px;      
}  
 
#banner h1 {
   margin: 0;
   padding: 0;
}  

h1.opacity  {
   filter: alpha(opacity=80);
   -moz-opacity: .80;
   opacity: 0.80;
}  

#right img {
   padding: 4px;
   background-color: #fff;
   border: 1px solid #4B5957;
}

#right p {
   margin: 15px 35px 15px 35px;
   font-size: 10px;
   line-height: 12px;
}    

ul#nav { 
   list-style-type: none; 
   margin: 0;
   padding: 0;
}
 
ul#nav a {
   display: block;   
   background-image: url(images/grad1.jpg);
   text-decoration: none;
   padding: 5px;
   width: 98%;
   border-top: 1px solid #fff;
   border-right: 1px solid #828282;
   border-bottom: 1px solid #828282;
   border-left: 1px solid #fff;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 11px;
   font-weight: bold;
   color: #4B5957;
}


ul#nav a:hover {
   background-image: url(images/grad2.jpg);
   border-top: 1px solid #828282;
   border-right: 1px solid #fff;
   border-bottom: 1px solid #fff;
   border-left: 1px solid #828282;
   color: #fff;
}

ul#nav li.last a {
   background-color: #4B5957;
   background-image: none;
   border: 1px solid #4B5957;
}

#footer {
   margin: 0; 
   padding: .15em 0 .15em 0;
   background-color: #4B5957;
   border-top: 1px solid #4B5957;
   width: 100%;   
}

#footer p {
   text-align: center;
   font-size: 10px;
   line-height: 12px;
   color: #BCDCD9;
}
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/