My category background needs to be able to expand when someone clicks a main category it will then show all the subcategories of the main category.
I set my category background to 100% thinking it would only be the height of the info inside the div but it isn't working.

I am not even sure this is the best way to code the site. Can someone look at my code and tell me how I can improve it and how I can get my category background to be fluid to match the height of my category list when they are clicked?

I am going to include both my html and also css. The div is options_bar1_bg

Also did I use the form correctly in my html?

html:
HTML Code:
<html>
<head>
<title>29501 Florence Motorsports</title>
                <!-- css stylesheet -->
                <link rel="stylesheet" type="text/css" href="style.css">
                <!-- /css stylesheet -->
</head>
<body id="body">
<table width="1019" height="100%" align="center" class="main">
<tr>
<td>
<div id="header_div">
<div id="header_pic"><img src="header_images/header.gif" width="1019" height="360"></div>
<div id="phone">CALL US AT: (843-669-8565)</div>
<div id="address">2702 TV Road  Florence S.C. 29501</div>
<div id="home"><a href="home.html" class="navi_text">HOME PAGE</a></div>
<div id="about"><a href="about.html" class="navi_text">ABOUT US</a></div>
<div id="service"><a href="service.html" class="navi_text">SERVICE DEPARTMENT</a></div>
<div id="wholesale"><a href="wholesale.html" class="navi_text">WHOLESALE REQUEST</a></div>
<div id="contact"><a href="contact.html" class="navi_text">CONTACT US</a></div>
<div id="black_line1"></div>
<div id="search_bar"></div>
<div id="search_icon"><img src="images/search_icon.jpg"></div>
<div id="search_text"><form method=get name=f1 onsubmit="return CheckSearch();" action="SearchResults.php">PRODUCT SEARCH:</div>
<div id="search_term">  <input name=SearchTerm type=text size="70"></div>
<div id="search_where"><select name=where><option value="ItemName">Title</option><option value="ItemDescription">Description</option></select></div>
<div id="search_order1"><select name=ord1><option value="">order by:</option><option value="ItemPrice">Price</option><option value="ItemName">Title</option><option value="AddDate">Date added</option></select></div>
<div id="search_order2"><select name=ord2><option value="asc">asc</option><option value="desc">desc</option></select></div>
<div id="search_button"><input type=submit name=search1 value="Search!" class=sub></form></div>
<div id="options_bar1"><img src="images/options_bar.jpg" width="210" height="32"></div>
<div id="options_bar1_text">Categories</div>
<div id="options_bar1_bg">Categories list here</div>
<div id="main_bar1"><img src="images/main_bar.jpg" width="587" height="32"></div>
<div id="main_bar1_text">Random Products</div>
<div id="options_bar2"><img src="images/options_bar.jpg" width="210" height="32"></div>
<div id="options_bar2_text">Shopping Cart</div>
</div>
</td>
</tr>
</table>
</body>
</html>
css:
Code:
<style type="text/css">
<!--
/*body_style*/
html, body {
height:100%;
margin:0px 0px 0px 0px;
background-image:url('bg.jpg');
background-repeat:repeat;
background-attachment:fixed;
border-width:0px;
border-color:064097;
border-style:solid;
}

#body {
height: 100%;
margin:0px 0px 0px 0px;
background-image:url('bg.jpg');
background-repeat:repeat;
background-attachment:fixed;
border-width:0px;
border-color:064097;
border-style:solid;
}

/*set_table_1*/
table.main {
        border-width: 1px;
        border-spacing: 0px;
        padding: 0px;
        border-style: solid;
        border-color:#000000;
        border-collapse: separate;
        background-color:#000000;
}
table.main th {
        border-width: 0px;
        padding: 0px;
        border-style: inset;
        border-color: 3376D2;
        background-color: none;
}
table.main td {
        border-width: 0px;
        padding: 0px;
        border-style: inset;
        border-color: 3376D2;
        background-color: none;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFFBFB;
        font-size:12px;
        letter-spacing:normal;
        font-style:none;
        font-weight:bold;
}

a {font-family:Times New Roman, tahoma, verdana; font-size:14px; color:#F67710; text-decoration:none}
a:hover {text-decoration:none; font-style:none; font-weight:none; color:#F78E39;}

a.navi_text {font-family:Arial; font-size:15px; color:#FFEA5F; text-decoration:none font-style:none;}
a.navi_text:hover {text-decoration:underline; font-style:none; font-weight:none; color:#FFEA5F;}

/*header_div*/
#header_div {
        position: relative; left:0px; top:0px;
        width:1019px; height:100%;
        border-width: 0px;
        padding: 0px;
        border-style: solid;
        border-color: transparent;
        background-color:#FFEA5F;
        }

#header_pic {
        position: absolute; left:0px; top:0px;
        width:1019px; height:370px; z-index:1;
        }
.phone {
        position: absolute; left: 50px; top: 5px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-style:normal;
        font-weight:bold;
        z-index:2;
        }
#phone {
        position: absolute; left: 50px; top: 5px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-style:normal;
        font-weight:bold;
        z-index:2;
        }
.address {
        position: absolute; left: 650px; top: 5px;
        width:1019px; height:20px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-style:normal;
        font-weight:bold;
        z-index:2;
        }
#address {
        position: absolute; left: 650px; top: 5px;
        width:1019px; height:20px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-style:normal;
        font-weight:bold;
        z-index:2;
        }
.home {
        position: absolute; left: 797px; top: 105px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
#home {
        position: absolute; left: 797px; top: 105px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
.about {
        position: absolute; left: 797px; top: 150px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
#about {
        position: absolute; left: 797px; top: 150px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
.service {
        position: absolute; left: 797px; top: 198px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
#service {
        position: absolute; left: 797px; top: 198px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
.wholesale {
        position: absolute; left: 797px; top: 245px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
#wholesale {
        position: absolute; left: 797px; top: 245px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
.contact {
        position: absolute; left: 797px; top: 292px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
#contact {
        position: absolute; left: 797px; top: 292px;
        font-family: "Arial";
        text-decoration: none;
        color: #FFEA5F;
        font-size:15px;
        letter-spacing:normal;
        font-style:none;
        font-weight:normal;
        z-index:2;
        }
#black_line1 {
        position: absolute; left: 0px; top: 360px;
        width:1019px; height:1px;
        border-width: 0px;
        padding: 0px;
        border-style: solid;
        border-color:transparent;
        background-color:#000000;
        z-index:2;
        }
#search_bar {
        position: absolute; left: 0px; top: 361px;
        width:1019px; height:30px;
        border-width: 0px;
        padding: 0px;
        border-style: solid;
        border-color: #000000;
        background-color: #A8232B;
        z-index:2;
        }
#search_icon {
        position: absolute; left: 5px; top: 363px;
        width:26px; height:26px;
        z-index:3;
        }
#search_text {
        position: absolute; left: 36px; top: 365px;
        width:200px; height:30px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-style:none;
        font-weight:none;
        z-index:2;
        }
#search_term {
        position: absolute; left: 230px; top: 365px;
        width:200px; height:30px;
        z-index:2;
        }
#search_where {
        position: absolute; left: 680px; top: 366px;
        width:200px; height:30px;
        z-index:2;
        }
#search_order1 {
        position: absolute; left: 778px; top: 366px;
        width:200px; height:30px;
        z-index:2;
        }
#search_order2 {
        position: absolute; left: 880px; top: 366px;
        width:200px; height:30px;
        z-index:2;
        }
#search_button {
        position: absolute; left: 940px; top: 364px;
        width:200px; height:30px;
        z-index:2;
        }
#options_bar1 {
        position: absolute; left: 3px; top: 395px;
        width:210px; height:32px;
        z-index:3;
        }
#options_bar1_text {
        position: absolute; left: 10px; top: 400px;
        width:210px; height:30px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-style:none;
        font-weight:none;
        z-index:4;
        }
#options_bar1_bg {
        position: absolute; left: 3px; top: 426px;
        width:208px; height:100%;
        border-width: 1px;
        padding: 0px;
        border-style: solid;
        border-color:#000000;
        background-color:#BD5338;
        z-index:3;
        }
#main_bar1 {
        position: absolute; left: 216px; top: 395px;
        width:587px; height:32px;
        z-index:3;
        }
#main_bar1_text {
        position: absolute; left: 228px; top: 400px;
        width:567px; height:30px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-weight:none;
        z-index:4;
        }
#options_bar2 {
        position: absolute; left: 806px; top: 395px;
        width:210px; height:32px;
        z-index:3;
        }
#options_bar2_text {
        position: absolute; left: 813px; top: 400px;
        width:210px; height:30px;
        font-family: "Times New Roman";
        text-decoration: none;
        color: #FFEA5F;
        font-size:20px;
        letter-spacing:normal;
        font-style:none;
        font-weight:none;
        z-index:4;
        }
</style>