Divs vertical ausrichrichten

driver

versuch dat mal

HTML

<html>
<head>
<style type="text/css"> 
body{ 
font-family: Verdana; 
font-size:12px; 
background-color:#00214a; 
} 


.link{ 
color:#ABD5FF; 
text-decoration: None; 
} 


a.link:hover{ 
color: #ffffff; 
text-decoration: None; 
} 


.tdmenu{ 
vertical-align:middle;
font-family: Verdana; 
font-size:11px; 
color: #ABD5FF; 
text-align: center; 
border-bottom: solid 1px #FFFFFF; 
width:166px;
height:50px;
z-index:0; 
} 


.menueitem{ 
font-family: Verdana; 
font-size:11px; 
color: #ABD5FF; 
border-bottom: solid 1px #748ca5;
border-left: solid 1px #FFFFFF; 
border-right: solid 1px #FFFFFF; 
background-color: #315273; 
} 


.bottommenueitem{ 
font-family: Verdana; 
font-size:11px; 
color: #ABD5FF; 
border-bottom: solid 1px #FFFFFF;
border-left: solid 1px #FFFFFF; 
border-right: solid 1px #FFFFFF; 
background-color: #315273; 
} 
</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>
</head>
<body> 
<table cellpadding=0 cellspacing=0 width="828" border=0 style="position: absolute; top: 10px; left: 0px; "> 
<tr> 
<td class="tdmenu"> 
<div onMouseover="anzeigen('menue#1')" onMouseout="anzeigen('menue#1')">HOME</div> 
</td> 


<td class="tdmenu">  
<div onMouseover="anzeigen('menue#2')" onMouseout="anzeigen('menue#2')">COMPANY</div>
</td> 


<td class="tdmenu"> 
<div onMouseover="anzeigen('menue#3')" onMouseout="anzeigen('menue#3')">FLEET</div> 
</td> 


<td class="tdmenu"> 
<div class="bereich" onMouseover="anzeigen('menue#4')" onMouseout="anzeigen('menue#4')">POSITIONS</div> 
</td> 


<td class="tdmenu"> 
<div class="bereich" onMouseover="anzeigen('menue#5')" onMouseout="anzeigen('menue#5')">SERVICES</div> 
</td> 
</tr> 


<tr>
<td>
<div id="menue#1" style="display: none;width:166px;z-index:10; margin-top:-1px;"> 
</div> 
</td>
<td>
<div id="menue#2" style="display: none;width:166px;z-index:10; margin-top:-1px;"> 
<div class="menueitem">[url='']Contact/Departments:[/url]</div> 
<div class="menueitem">[url='']&middot;Management[/url]</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"><a href="" class="link">&middot;Administration& 


&nbspCrewing</a></div> 
<div class="menueitem">[url='']&middot;Insurance[/url]</div> 
<div class="menueitem"><a href="" class="link">&middot;Technical & Nautical 


Department</a></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> 
</td>
<td>
<div id="menue#3" style="display: none;width:166px;z-index:10; margin-top:-1px;"> 
<div class="menueitem">[url='']Panamaxes:[/url]</div> 
<div class="menueitem">[url='']&middot;Clara[/url]</div> 
<div class="menueitem">[url='']&middot;Christina[/url]</div> 
<div class="menueitem">[url='']&middot;Carola[/url]</div> 
<div class="menueitem">[url='']Superhandymaxes:[/url]</div> 
<div class="menueitem">[url='']&middot;Kawasakis[/url]</div> 
<div class="menueitem">[url='']&middot;Tess 58[/url]</div> 
<div class="menueitem">[url='']Large Handysizes:[/url]</div> 
<div class="menueitem">[url='']&middot;Patriot[/url]</div> 
<div class="menueitem">[url='']&middot;Palau[/url]</div> 
<div class="menueitem">[url='']&middot;Papua[/url]</div> 
<div class="menueitem">[url='']Small Handysizes:[/url]</div> 
<div class="menueitem">[url='']&middot;Ida[/url]</div> 
<div class="menueitem">[url='']&middot;Lita[/url]</div> 
<div class="menueitem">[url='']&middot;Bellatrix ID[/url]</div> 
<div class="menueitem">[url='']&middot;Olga[/url]</div> 
<div class="menueitem">[url='']&middot;Comet[/url]</div> 
<div class="menueitem">[url='']Container Vessels:[/url]</div> 
<div class="bottommenueitem">[url='']&middot;Maersk Naha[/url]</div> 
</div>
</td>
<td>
<div id="menue#4" style="display: none;width:166px;z-index:10; margin-top:-1px;"> 
</div>
</td>
<td>
<div id="menue#5" style="display: none;width:164px;z-index:10; margin-top:-1px;"> 
<div class="menueitem">[url='']Chartering[/url]</div> 
<div class="menueitem">[url='']S&P[/url]</div> 
<div class="menueitem">[url='']Ship Management[/url]</div> 
<div class="bottommenueitem">[url='']Crewing[/url]</div> 
</div> 
</td>
</tr>
</table>
</body>
</html>

Alles anzeigen

driver

oder so

Tags