vb.org Archive - How do I add background border images around main content?

First off, this is for a LIQUID (90%) layout, fixed is not an option.

My forum currently looks like this:
http://www.booost.com/dev/without_bg.jpg

What do I need to edit to get borders like this?
http://www.booost.com/dev/with_bg.jpg

I've tried doing this the old-school way using tables in the header/footer to create columns around the entire forum but its not working at all. http://www.supramania.com/ has this style but I can't seem to get it to work using their source code. Any ideas?

I've gotten this to work using the method supramania.com has by studying their code but there is a bug when the page does not span the full height of the browser window like so: http://www.booost.com/dev/bg_bug.jpg

Here is the code I used to achieve the effect (which works fine if the page spans 100% of the height):

Style Manager > Common Templates > Header

Code:

<div id="content1">

<div id="content2">

<!-- content table -->

$spacer_open



$_phpinclude_output

Style Manager > Common Templates > Footer

Code:

<br />

<div class="smallfont" align="center">$vbphrase[all_times_are_gmt_x_time_now_is_y]</div>

<br />



....



</div>

</div>

Style Manager > Main CSS > Body

Code:

margin: 0px;

padding: 0px;

background:transparent;

background-image:url(http://www.booost.com/forums/images/page_bgright.gif);

background-position:right;

background-repeat:repeat-y;

min-height:100%;

Style Manager > Main CSS > Additional CSS Definitions

Code:

/* ***** styling for 'big' usernames on postbit etc. ***** */

.bigusername { font-size: 14pt; }



/* ***** small padding on 'thead' elements ***** */

td.thead, div.thead { padding: 2px; }



/* ***** basic styles for multi-page nav elements */

.pagenav a { text-decoration: none; }

.pagenav td { padding: 2px 4px 2px 4px; }



/* ***** define margin and font-size for elements inside panels ***** */

.fieldset { margin-bottom: 6px; }

.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }



/* ***** don't change the following ***** */

form { display: inline; }

label { cursor: default; }

.normal { font-weight: normal; }

.inlineimg { vertical-align: middle; }



html {

 margin:0;

 padding:0;

 background-color:#899198;

 background-image:url(images/page_bgleft.gif);

 background-position:left;

 background-repeat:repeat-y;

 color:black;

}



div#content1 {

 margin-left:35px;

 margin-right:35px;

 border:0px;

 background-color:#899198;

 color:black;

}

div#content2 {

 padding-left:0px;

 padding-right:0px;

I guess the main question is, how do I make the main "page" portion of my forums always stretch to 100% of the height of the browser window?

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.00993 seconds Memory Usage 1,718KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (4)bbcode_code_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)post_thanks_navbar_search (1)printthread (1)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: