Inserir uma DIV dentro de uma tabela respeitando a posição

Bom dia prezados usuários,

Estou fazendo uma div com rollover , porém estou precisando alinhar ela em uma tabela dentro do meu site, como é um modelo de um tutorial, eu fiquei meio perdido, tentei mais não consegui fazer.

Alguem poderia me dar uma ajuda?

CSS DIVS

.Scroller-Container {
 position: absolute;
 top: 0px; left: 0px;
}
.Scrollbar-Up {
 position: absolute;
 width: 10px; height: 10px;
 background-color: #CCC;
 font-size: 0px;
}
.Scrollbar-Track {
 width: 10px; height: 160px;
 position: absolute;
 top: 20px;
 background-color: #EEE;
}
.Scrollbar-Handle {
 position: absolute;
 width: 10px; height: 30px;
 background-color: #CCC;
}
.Scrollbar-Down {
 position: absolute;
 top: 190px;
 width: 10px; height: 10px;
 background-color: #CCC;
 font-size: 0px;
}
#Scrollbar-Container {
 position: absolute;
 top: 50px; left: 460px;
}

#Container {
	position: absolute;
	top: 50px;
	left: 50px;
	width: 400px;
	height: 200px;
	background-image: url(imgs/bgletra1.jpg);
	background-attachment: fixed;
}

#News, #About, #Extra {

 position: absolute;
 top: 10px;
 overflow: hidden;
 width: 400px;
 height: 180px;
 display: none;
}

#News {display: block;} p {

 margin: 0; padding: 0px 20px 10px;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 11px;
 text-indent: 20px;
 color: #777;
}
#Navigation {
 position: absolute;
 top: 30px;
 left: 75px;
}

#Navigation a {

 margin: 5px 2px 0 0;
 padding: 0 5px;
 height: 20px;
 background-color: #E4E4E4;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 10px;
 color: #AAA;
 text-decoration: none;
 display: block;
 float: left;
 letter-spacing: 1px;
}

#Navigation a:hover {

 margin-top: 0px;
 height: 25px;
}

#Navigation a.current {

 margin-top: 0px;
 height: 25px;
 background-color: #EEE;
 color: #777;
}

Exibição dela.

<div id="Navigation">

 <a href="#" onclick="return swapIt(this)" title="News" class="current">inglês</a>
 <a href="#" onclick="return swapIt(this)" title="About">português</a>
 <a href="#" onclick="return swapIt(this)" title="Extra">info</a>
</div>
<div id="Container">
 <div id="News">
	<div class="Scroller-Container">
	<?

include("config.php");
$conexao = mysql_connect($dbserver, $dbuser,$dbpass);
$db = mysql_select_db("direitoa_jj");
$sql = "SELECT * FROM faixas WHERE idcd = '$idcd' and faixa = '$faixa' ORDER BY id DESC LIMIT 1";

$resultado = mysql_query($sql)
or die ("Não foi possível realizar a consulta ao banco de dados");
while ($linha=mysql_fetch_array($resultado)) {

$letra = $linha["letra"];

echo "<div align=center class=style2>".$letra."</div>";
}

?>
	</div>

 </div>
 <div id="About">
	<div class="Scroller-Container">
 <?

$sql = "SELECT * FROM faixas WHERE idcd = '$idcd' and faixa = '$faixa' ORDER BY id DESC LIMIT 1";

$resultado = mysql_query($sql)
or die ("Não foi possível realizar a consulta ao banco de dados");
while ($linha=mysql_fetch_array($resultado)) {

$letratra = $linha["letratra"];

echo "<div align=center class=style2>".$letratra."</div>";
}

?>
	</div>

 </div>
 <div id="Extra">
	<div class="Scroller-Container">
 <p>Vivamus vehicula. Integer cursus massa et nisl. Morbi pretium sem eget risus. Vestibulum nec est. Donec feugiat purus et ligula. Quisque semper. Sed eu ante. Curabitur suscipit porttitor libero. Nam eros leo, sollicitudin eget, tincidunt vitae, facilisis a, dui. Proin neque. Aliquam erat volutpat. Pellentesque felis.</p>
	</div>
 </div>
</div>
<div id="Scrollbar-Container">
 <div class="Scrollbar-Up"></div>

 <div class="Scrollbar-Down"></div>
 <div class="Scrollbar-Track">
	<div class="Scrollbar-Handle"></div>
 </div>
</div>

Gostaria de cricar uma table no começo e no fim, e estas divs respeitarem o limite desta tabela, pois a página está centralizado e desta forma a div desalinha com o restante da página em resoluções diferente da minha,

Grato