Код:

<style>
#my-table,#my-table tr,#my-table td {
  border-spacing:0px;
  border-collapse: collapse;
}
#my-table{
  margin-top:200px;
  margin-left:-12px;
}

#my-table tr.a>td{
  width:11.11%;
  border:1px solid red;
  font: normal normal 400 12.76px/normal Tahoma;
  color:#000;  
}
#my-table .cnt {
  margin:0;
  padding:8px;
  text-align:center;
  position:absolute;
  width:222px;
  overflow-y:auto;
  overflow-x:visible;
  display:none;
}
#my-table .cnt.active {
  display:block;
}
#my-table .tr1>td {
  cursor:pointer;
}
</style>
<table id="my-table" width=100% height=500 cols=9>
<tr class="a tr1" align=center  valign=top  height="24">
<td class="active">1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td>
<td colspan="3" rowspan="2">
<!-- Правый Столбец таблицы -->
<p>Самое важное:</p>
ячсячсячсясч
</td>
</tr><tr class="a tr2" valign=top>
<td colspan="6">
<!-- 1-я вкладка -->
<div class="cnt active">
 1-я вкладка
</div>
<!-- 2-я вкладка -->
<div class=cnt>
 2-я вкладка
</div>
<!-- 3-я вкладка -->
<div class=cnt>
 3-я вкладка
</div>
<!-- 4-я вкладка -->
<div class=cnt>
 4-я вкладка
</div>
<!-- 5-я вкладка -->
<div class=cnt>
 5-я вкладка
</div>
<!-- 6-я вкладка -->
<div class=cnt>
 6-я вкладка
</div>
</td>
</tr>
</table>
<script type="text/javascript">
(function(){
  var switches = $('#my-table .tr1>td').not(':last');
  var cnt      = $('#my-table .tr2>td>.cnt');
 
  switches.click(function(){
    var num = switches.index(this);
    cnt.removeClass('active');
    switches.removeClass('active');
 
    switches.eq(num).addClass('active');
    cnt.eq(num).hide().addClass('active').fadeIn(600);
  });
})();
</script>