Breite von Menüpunkten

[Chris]

hi leute,
hab folgendes problem:
ich hab ein horizontales menü, das aus 4 elementen besteht:

<div id="main-menu">  
             <li><a href="dienste.html">Dienste</a></li>  
                <li><a href="dienste.html">Produkte</a></li>  
                <li><a href="dienste.html">Anfahrt</a></li>  
                <li><a href="dienste.html">Kontakt</a></li>  
</div>

jetzt will ich, dass alle elemente eine feste breite haben, da sie sich sonst bei einem hover wegen dem font-weight:bold ausdehnen, also breiter werden und die restlichen elemente nach außen schieben.

  
#main-menu{  
height:50px;  
width:500px;  
color: #000000;  
text-align: center;  
list-style-type: none;  
}  
#main-menu li{  
color: #FF8000;  
display: inline;  
}  
#main-menu li a{  
color: #000000;  
text-decoration: none;  
}  
#main-menu li a:hover{  
font-weight: bold;  
color:#FF8000;  
}

hoffe man kann mein problem verstehen^^
wenn jemand ne andere lösung, außer fester breite, hat bin ich aufgeschlossen....will nur dass es sich nicht so "ausdehnt".

schonmal im vorraus, DANKE!