this is how i did it on my site for testing purposes.
Code:
.thrColLiqHdr #sidebar1 {
float: left;
width: 220px;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #CC95B5;
padding-top: 20px;
padding-right: 0px;
padding-left: 0px;
padding-bottom: 9999px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: -9999px;
margin-left: 0px;
height: 500px;
background-color: #F8E6F0;
}
.thrColLiqHdr #sidebar2 {
float: right; /* this element must precede in the source order any element you would like it be positioned next to */
width: 180px; /* top and bottom padding create visual space within this div */
background-color: #F8E6F0;
background-repeat: no-repeat;
border-left-width: 1px;
border-left-style: solid;
border-left-color: #CC95B5;
padding-top: 20px;
padding-right: 0px;
padding-bottom: 9999px;
padding-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: -9999px;
margin-left: 0px;
background-image: url(../images/fount_bot.png);
background-position: right top;
height: 500px;
}
/* Tips for mainContent:
1. the space between the mainContent and sidebars is created with the left and right margins on the mainContent div.
2. to avoid float drop at a supported minimum 800 x 600 resolution, elements within the mainContent div should be 300px or smaller (this includes images).
3. in the Internet Explorer Conditional Comment below, the zoom property is used to give the mainContent "hasLayout." This avoids several IE-specific bugs.
*/
.thrColLiqHdr #mainContent {
font-family: "Times New Roman", Times, serif;
font-size: 1.1em;
margin-top: 0px;
margin-right: 180px;
margin-bottom: 0;
margin-left: 220px;
padding-top: 0px;
padding-right: 10px;
padding-bottom: 0px;
padding-left: 20px;
}