Nvigationsleiste

Hey Leute,

hab mal ne frage ich will mir ne Navigationsleiste bauen mit divs und einer tabelle. Diese soll ein dropdown menühaben. Es leuft auch eigentlich alles auf dem Internetexplorer ABER das einzige problem ist das ich die Schrift in der Menüleiste nicht vertikal Zentriert bekommen ich will sie auf valign: middle; setzen aber das klapt irgendwie nicht!! Kann mir da einer helfen?? Hier ist der Quelltext:

<style type="text/css">

body
{
padding:0;
margin:0;
height:100%;

font-family: Verdana, Arial;
font-size:12px;
background-color:#01274C;
}

.bereich{
height:20px;
display: block;
color: #69B3CB;
background-color: #01274C;
text-align: center;
font-family: Verdana, Arial;
font-size: 12px;
}

a.link{
border: solid 1px #FF0000;
display: block;
color: #69B3CB;
font-family: Verdana, Arial;
font-size: 12px;
text-decoration: None;
text-align: left;
background-color: #315273;
height: 22px;
}

a.bottomlink{
display: block;
color: #69B3CB;
font-family: Verdana, Arial;
font-size: 12px;
text-decoration: None;
text-align: left;
background-color: #315273;
height: 22px;
}

.menueitem{
style="position:relative;
bottom:0px;"
height: 50px;
weight: 200px;
border-bottom: solid 1px #748ca5;
border-top: solid 1px #748ca5;
border-left: solid 1px #FFFFFF;
border-right: solid 1px #FFFFFF;
background-color: #315273;
}

.bottommenueitem{
vertical-align: middle;
border-bottom: solid 1px #FFFFFF;
border-left: solid 1px #FFFFFF;
border-right: solid 1px #FFFFFF;
background-color: #315273;
}

a.link.bereich{
display: block;
background-color: #325475;
width: 200px;
height: 22px;

}

a.link:hover{
display: block;
color: #ffffff;
background-color: #325475;
}

a.bottomlink:hover{
display: block;
color: #ffffff;
background-color: #325475;
}

.borderbottom{
border-bottom: solid 1px #FFFFFF;
width:200px;
height:22px;
z-index:0;
}

a.link1{
display: block;
color: #69B3CB;
font-family: Verdana, Arial;
font-size: 12px;
text-decoration: None;
}

</style>

<script type='text/javascript'>
function anzeigen(das){
if(document.getElementById(das).style.display=='none')
document.getElementById(das).style.display='block';
else document.getElementById(das).style.display='none';}
</script>

<table cellPadding=0 cellSpacing=0 style="position: absolute; top: 10px; left: 0px;">
<tr>
<td valign=top width=200>
<div class="bereich" onMouseover="anzeigen('menue#1')" onMouseout="anzeigen('menue#1')" style="background-color:#01274C;">
<span class="borderbottom">HOME</span>

</div>
</td>

<td valign=top width=200>
<div class="bereich" onMouseover="anzeigen('menue#2')" onMouseout="anzeigen('menue#2')">
<div class="borderbottom">COMPANY</div>
<div id="menue#2" style="display: none;width:200px;z-index:10; margin-top:-1px;">
<div class="menueitem">Contact/Departments:</div>
<div class="menueitem">[url='']&middot;Management[/url]</div>
<div class="menueitem">ccccc</div>
<div class="menueitem">[url='']&middot;Chartering[/url]</div>
<div class="menueitem">[url='']&middot;Operating[/url]</div>
<div class="menueitem">[url='']&middot;S & P[/url]</div>
<div class="menueitem">[url='']&middot;Administration & Crewing[/url]</div>
<div class="menueitem">[url='']&middot;Insurance[/url]</div>
<div class="menueitem">[url='']&middot;Technical & Nautical Department [/url]</div>
<div class="menueitem">[url='']&middot;Safety Management[/url]</div>
<div class="menueitem">[url='']&middot;Procurement[/url]</div>
<div class="menueitem">[url='']&middot;Accounting & Controlling[/url]</div>
<div class="menueitem">[url='']Profile[/url]</div>
<div class="menueitem">[url='']Vacancies:[/url]</div>
<div class="menueitem">[url='']&middot;Shore Staff[/url]</div>
<div class="menueitem">[url='']&middot;Seagoing Staff[/url]</div>
<div class="menueitem">[url='']Gallery:[/url]</div>
<div class="menueitem">[url='']&middot;Ships[/url]</div>
<div class="menueitem">[url='']&middot;Launching Ceremonies[/url]</div>
<div class="bottommenueitem">[url='']&middot;Headquarter[/url]</div>
</div>
</div>
</td>
<td valign=top width=200>
<div class="bereich" onMouseover="anzeigen('menue#3')" onMouseout="anzeigen('menue#3')">
<span class="borderbottom">FLEET</span>
<span id="menue#3" style="display: none;width:200px;margin-top:-1px;">
[url='']Panamaxes:[/url]
[url='']&middot;Clara[/url]
[url='']&middot;Christina[/url]
[url='']&middot;Carola[/url]
[url='']Superhandymaxes:[/url]
[url='']&middot;Kawasakis[/url]
[url='']&middot;Tess 58[/url]
[url='']Large Handysizes:[/url]
[url='']&middot;Patriot[/url]
[url='']&middot;Palau[/url]
[url='']&middot;Papua[/url]
[url='']Small Handysizes:[/url]
[url='']&middot;Ida[/url]
[url='']&middot;Lita[/url]
[url='']&middot;Bellatrix ID[/url]
[url='']&middot;Olga[/url]
[url='']&middot;Comet[/url]
[url='']Container Vessels:[/url]
[url='']&middot;Maersk Naha[/url]

</span>
</div>
</td>

<td valign=top width=200>
<div class="bereich" onMouseover="anzeigen('menue#4')" onMouseout="anzeigen('menue#4')">
<span class="borderbottom">POSITIONS</span>
<span id="menue#4" style="display: none;width:200px;margin-top:-1px;">
[url='']Demolink[/url]
[url='']Demolink[/url]
</span>
</div>
</td>

<td valign=top width=200>
<div class="bereich" onMouseover="anzeigen('menue#5')" onMouseout="anzeigen('menue#5')">
<span class="borderbottom">SERVICES</span>
<span id="menue#5" style="display: none;width:200px;margin-top:-1px;">
[url='']Chartering[/url]
[url='']S&P[/url]
[url='']Ship Management[/url]
[url='']Crewing[/url]

</span>
</div>
</td>

</tr>
</table>

hab ich ja probiert aber dat funtzt leider nicht ich komm da voll net weiter ich weis nicht lieg das vielleicht daran das ein link im div steht???