navi verschiebt sich

[eisn]

hallo,

meine navigationsleiste verschiebt sich bei unterschiedlicher auflösung, wodurch kann ich das unterbinden?
der für die leiste relevante css- und html-code is folgender:

  
.navigation{  
margin-left:50px ;  
margin-top:-5px ; /*musste leicht verschoben werden, aber auch ohne margin verschob sich die leiste */  
}  
  
ul#Navigation li {  
text-align:center ;  
list-style:none ;  
float:left ;  
}  
  
ul#Navigation li ul {  
position:absolute ;  
display:none ;  
padding:0 ;  
}  
  
ul#Navigation li:hover ul {  
display:block ;  
background-color:black ;  
}  
  
ul#Navigation li ul li {  
float:none ;  
display:block ;  
}  
  
ul#Navigation a, ul#Navigation span {  
display:block ;  
width:131px ;  
height:36px ;  
text-decoration:none ;  
color:white ;  
font-family: Arial Black, Helvetica ;  
}  

  
<center>  
<div class="navigation">  
<ul id="Navigation">  
  <li><a class="start" href="index.htm">Home</a></li>  
  <li><a class="about" href="about us.htm">About Us <small>▼</small></a>  
   <ul>  
   <li><a class="about" href="about us.htm">BF Bio</a></li>  
   <li><a class="contact" href="contact.htm">Contact Us</a></li>  
   </ul>  
  </li>  
  <li><a class="releases" href="releases.htm">Releases</a></li>  
  <li><a class="freestuff" href="free downloads.htm">Free Stuff <small>▼</small></a>  
   <ul>  
   <li><a class="fdnb" href="free drum n bass.htm">DNB</a></li>  
   <li><a class="fdubstep" href="free dubstep.htm">Dubstep</a></li>  
   <li><a class="mixsets" href="mixsets.htm">Mixsets</a></li>  
   <li><a class="podcasts" href="podcasts.htm">Podcasts</a></li>  
   </ul>  
  </li>  
  <li><a class="artistz" href="artistz.htm">Artistz</a></li>  
  <li><a class="forthcomin" href="forthcoming.htm">Forthcomin</a></li>  
</ul>  
</div>  
      </center>  

die klassen der links sind nur für die textformatierung da, nicht zur positionierung.

vielen dank schonmal
eisn