Buongiorno a tutti.
Ho scritto il seguente codice html, javascript e css:
codice:
<html>
	<head>
		<script type="text/javascript">
			function apriMenu(menu)
			{
				document.getElementById(menu).style.display = "block";
			}
			function togliMenu(menu)
			{
				document.getElementById(menu).style.display = "none";
			}
		</script>
		<style type="text/css">
			.menuBar
			{
				background: #000FFF;
				height: 40px;
				text-align: right;
			}
			.menu
			{
				width: 150px;
				height: 40px;
				border-left: #FFFFFF 1px solid;
				text-align: center;
			}
			.sottomenu
			{
				position:absolute;
				width: 110px;
				background: #0000FF;
				font-size: 14;
			}
			a.menuLink
			{
				font-family: Tahoma;
				font-size: 14px;
				font-weight: bold;
				text-decoration: none;
				color: #FFFFFF;
			}
		</style>
	</head>
	<body>
		<div class="menuBar" width="100%">
			<table border="0" align="right" valign="center" cellpadding="0" cellspacing="0">
				<tr>
					<td class="menu" valign="center"> Menu1</td>
					<td class="menu" valign="center"> Menu2</td>
					<td class="menu" valign="center"> Menu3</td>
				</tr>
				<tr>
					<td>
						<div id="menu1" class="sottomenu" style="display:none">
							sottomenu 1.1

							sottomenu 1.2

							sottomenu 1.3

						</div>
					</td>
					<td>
						<div id="menu2" class="sottomenu" style="display:none">
							sottomenu 2.1

							sottomenu 2.2

							sottomenu 2.3

						</div>
					</td>
					<td>
						<div id="menu3" class="sottomenu" style="display:none">
							sottomenu 3.1

							sottomenu 3.2

							sottomenu 3.3

						</div>
					</td>
				</tr>
			</table>
		</div>
	</body>
</html>
esso mi permette di costruire un menu orizzontale.
Il problema è sul css con class = menuLink
Quando inserisco menuLink: link{} menuLink: visited{} e menuLink: hover{}
perdo tutte le impostazioni del menuLink generale e non mi tiene valide neanche quelle dei singoli menuLink: ...
Ho fatto qualcosa di strano? Devo modificare qualcosa?
Grazie a tutti per l'aiuto