Hi everyone,
I have created tabs using Dreamweaver but somehow text underneath tab got white space, I am trying to achieve something where text underneath can shift its position(upwards) depending on available space?
Code:
<style type="text/css">
<!--

.head1 {
	background-color: #9cc005;
	height: 45px;
	width: 148px;
	margin:0px;
	color:#FFFFFF;
	padding-top:10px;
	text-align:left;
	clear:both;
	
	
	}
.head2 {
	background-color: #b8dc32;
	height: 45px;
	width: 146px;
	color:#FFFFFF;
	 /*margin: -42px 0px 0px 148px;*/
	position:inherit;
	padding-top:10px;
	text-align:left;
}
.des {
	background-color: #9cc005;
	width: 294px;
	margin-top: 0px;
	text-align:left;
position:absolute;


	
	
}
.des1 {
	background-color: #9cc005;
	width: 294px;
	margin-top: 0px;
position:inherit;
	visibility: hidden;
		text-align:left;
		clear:both;
}
-->
</style>


<!--[if !IE]>-->
<style type="text/css">
.head2 {

	 margin: -55px 0px 0px 148px !important;

}


</style>
<!--<![endif]-->

<!--[if IE]>
<style type="text/css">

.head2 {

	 margin: -45px 0px 0px 148px !important;

}
</style>

<![endif]-->


<script type="text/javascript">
<!--
function MM_showHideLayers() { //v9.0
  var i,p,v,obj,args=MM_showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) 
  with (document) if (getElementById && ((obj=getElementById(args[i]))!=null)) { v=args[i+2];
    if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
    obj.visibility=v; }
}
function MM_changeProp(objId,x,theProp,theValue) { //v9.0
  var obj = null; with (document){ if (getElementById)
  obj = getElementById(objId); }
  if (obj){
    if (theValue == true || theValue == false)
      eval("obj.style."+theProp+"="+theValue);
    else eval("obj.style."+theProp+"='"+theValue+"'");
  }
}
//-->
</script>



<div id="RightColumn" style="overflow:hidden; height:auto;">
<div class="head1 SmallFonts" id="heading1" onclick="MM_showHideLayers('main1','','show','main2','','hide');MM_changeProp('heading1','','backgroundColor','#9cc005','DIV');MM_changeProp('heading2','','backgroundColor','#b8dc32','DIV')"><b>&nbsp;&nbsp; Find a treatment<br />
&nbsp;&nbsp;&nbsp;near you</b></div>

<div class="head2 SmallFonts" id="heading2" onclick="MM_showHideLayers('main2','','show','main1','','hide');MM_changeProp('heading2','','backgroundColor','#9cc005','DIV');MM_changeProp('heading1','','backgroundColor','#b8dc32','DIV')"><b>&nbsp;&nbsp; Find a consultant<br />
&nbsp;&nbsp;&nbsp;near you</b></div>


<div class="des" id="main1"><!----Content 1 starts here ------->

<table width="270" border="0" align="center" cellpadding="3" cellspacing="2">
  <tr>
    <td class="SmallFonts"><strong>Choose from the list:</strong></td>
  </tr>
  <tr>
    <td>
    <select name="p_treatment_id" id="select" class="FormDrop" style="width:225px" >
        
<option value="">Choose a treatment</option>
        
<option value="197">Abdominal surgery for Crohn's Disease</option>
        
<option value="199">Acupuncture</option>
        
<option value="234">Adenoidectomy (child)</option>
        
<option value="342">Allergy services</option>
        
<option value="196">Anal fistula surgery</option>
        
<option value="183">Angioplasty</option>
        
<option value="347">Ankle replacement</option>
        

      </select>    </td>
  </tr>
  <tr>
    <td class="SmallFonts">By postcode, town or country</td>
  </tr>
  <tr>
    <td><label>
      <input type="text" name="textfield3" id="textfield3">
    </label></td>
  </tr>
  <tr>
    <td><table align="left" cellpadding="0" cellspacing="0">
      <TR>
        <TH scope="col" class="SmallFonts">&nbsp;</TH>
      </TR>
      <TR>
        <TH scope="col"> 
            <TABLE width="150" border="0" align="left" cellPadding="0" cellSpacing="0">
              <TBODY>
                <TR>
                  <TH vAlign="top" scope="col" width="25" height="15" class="SmallFonts">&nbsp;</TH>
                  <TH vAlign="bottom" scope="col" width="25" height="15">&nbsp;</TH>
                  <TH vAlign="top" scope="col" width="25" height="15" class="SmallFonts">&nbsp;</TH>
                  <TH vAlign="bottom" scope="col" width="25" height="15">&nbsp;</TH>
                  <TH vAlign="top" scope="col" width="25" height="15" class="SmallFonts">&nbsp;</TH>
                  <TH vAlign="bottom" scope="col" width="25" height="15">&nbsp;</TH>
                </TR>
              </TBODY>
            </TABLE>
            <INPUT id="imageField4" type="image" alt="Search" src="images/buttons/search_button.gif" align="right" border="0" name="imageField5">
       </TH>
      </TR>
    </table>
    </td>
  </tr>
</table>

<!---------------- Content 1 ends here ------------->
</div>

<div class="des1" id="main2">
<!------- Content 2 starts here ----------->

<table width="270" border="0" align="center" cellpadding="3" cellspacing="2">
  <tr>
    <td colspan="2" class="SmallFonts"><strong>By surname:</strong></td>
  </tr>
  <tr>
    <td colspan="2"><input name="textfield" type="text" class="FormInput" id="textfield2" value="Enter surname eg... Smith" onFocus="if (this.value=='eg. Knee')

{this.value=''};" ></td>
  </tr>
  <tr>
    <td colspan="2" class="SmallFonts"><strong>By keywords:</strong></td>
  </tr>
  <tr>
    <td colspan="2"><input name="textfield2" type="text" class="FormInput" id="textfield" value="Enter keywords eg... Cosmetic"  onFocus="if (this.value=='eg. Knee')

{this.value=''};" ></td>
  </tr>
  <tr>
    <td colspan="2" class="WhiteFonts SmallFonts"><b>Or</b></td>
  </tr>
  <tr>
    <td colspan="2" class="SmallFonts">By specialty:</td>
  </tr>
  <tr>
    <td colspan="2">

        <SELECT name="p_speciality" style="width:225px" class="FormDrop">
        <OPTION value="" selected>-By Specialty   (please select)-</OPTION>
        <OPTION value="618">Allergy</OPTION>
        <OPTION value="2">Anaesthetics</OPTION>
        <OPTION value="4">Audiology</OPTION>
        <OPTION value="8">Breast surgery</OPTION>
       
        </SELECT>
     </td>
  </tr>
  <tr>
    <td colspan="2" class="SmallFonts">By location:</td>
  </tr>
  <tr>
    <td colspan="2">
      <SELECT name="p_locality" class="FormDrop">
        <OPTION value="" selected>-By Location   (please select)-
          <OPTION value="298">Albyn Hospital
          <OPTION value="314">Bath   Clinic
       
      </SELECT>
    </td>
  </tr>
  <tr>
    <td><INPUT id="imageField" type="image" alt="Search" src="/images/buttons/search_button.gif" align="top" name="imageField4"></td>
    <td class="WhiteFonts SmallFonts"><b>View all</b></td>
  </tr>
</table>

<!------- Content 2 ends here ------------->

</div>
</div>
Text should be right under the tab, where green bit finishes<br>
Text should be right under the tab<br>
Text should be right under the tab
Sorry for long code thanks in advance