Dopo lunghe ed estenuanti ricerche e prove sono riuscita a fare questo

/* inizio minitabs*/
div#navigation{
background-color:#FFF;
border-bottom: 1px solid #787878;
padding-left: 20px;
background-image:url(../Images/3_01.png);
font-weight:bold;
}
div#navigation ul{
list-style-type:none;
margin: 0;
padding: 0;
white-space:nowrap}
div#navigation li{
display: inline;
margin: 0;
padding: 0;
}
div#navigation li a{
text-decoration: none;
color:#ccc;
border: 1px solid #999;
padding: 0 0.3em;
background:#B42942; color:#ccc;
background-image:url(../Images/2_01.gif)}
div#navigation li a:hover{
/*background-color:#f0f0f0;*/
color:#B42942;
font-weight:bold;
}
div#navigation li#activelink a{
border-bottom: 1px solid #fff;
background-color: #fff;
background-image:url(../Images/2_01.png);
color:#B42942
}
/*fine minitabs*/

/*inizio prova sbmenu*/
div#navigation li ul {display:none}
div#navigation li:hover ul {
display: inline;
position: absolute;
padding: 0 0.3em;
margin: 20px 0 0 -80px;
border:1px solid black;
background: white;
z-index:1
}

div#navigation li li {
border: none;
background:none;
}
div#navigation li li a {padding: 2px 2px 2px 10px; background:none; border:none; color:#333333}
/* fine prova sub menu*/

-------------------------------------------------------------------------
<div id="navigation" align="center">
<ul>
<li id="activelink">Home[*]Company
<ul>
[*]sub menu 1|
[*]sub menu 2|

[/list]
[*]Products[*]News[*]Map[/list]</div>
-----------------------------------------------------------------------------

Ma non saprei dire se è del tutto corretto dato che ho mischiato svariate cose o se posso fare ancora qualcosa, ad esempio non riesco a capire come mai se il sotto menu si discosta troppo dal border bottom del menu poi non riesco ad andarci sopra con il mouse poiché il sottomenu scompare appena il mouse trova il punto morto del body.

Mi aiutate?