Ciao a tutti,

con questo codice di seguito riportato, ci sto litigando di brutto per poter avere centrate entrambe le linee sulla riga in quanto avendo una quantità di voci diverse, non ha molto senso avere le righe allineate sul lato sinistro (ho pensato a 2 righe perché magari se devo aprire il sito su un iPhone utilizzando il menù a tendina verticale non vorrei che poi la tendina verticale si posiziona altrove anziché sotto la voce di menù...).... avete magari una dritta?...

Qui il codice di test riportato con il relativo CSS:

codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>	
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>	
	<title>Menu Tester</title>		
	<style type="text/css">	
		* {
			border:0;			
			padding:0;			
			margin:0;					
		}
		body 
		{
			font-size: 0.75em;
			color: #333;
		}
		#container
		{
			width: 75em;
			margin-top: 1.0em;
			margin-bottom: 1.0em;
			margin-left: auto;
			margin-right: auto;
			padding: 1.0em 1.0em 1.0em 1.0em;
			text-align: center;
		}
		#inside
		{
			margin: 0;
			padding: 0.5em 0 0.5em 0;
			background: #92b6ff; 
			text-align: center; 	
			border: 0.2em dotted green;
		}
		#navcontainer
		{
			background: #92b6ff;
			margin-left: auto;
			margin-right: auto;
			margin-top: auto;
			margin-bottom: 0.5em;
			border: 0.2em dotted black;
			height: 3.75em;
			color: #333333;
			width: 100%;
		}
		#menu
		{
			font: bold 1.083em verdana, arial, sans-serif;
			margin-left: auto;
			margin-right: auto;
			position: relative;
			width: 100%;
			height: 3.75em;
			border: 0.2em dotted darkblue;
		}
		#menu ul
		{
			/*margin-left: -0.083em;*/
			margin: auto auto;
			padding-left: auto;
			padding-right: auto;
			padding-left: 13.75em;
			list-style-type: none;
			/*position: relative;*/
			border: 0.2em dotted magenta;
			height: 1.75em;
		}
		#menu ul li
		{
			float: left;
			padding-left: 0.167em;
			border: 0.2em dotted brown;
		}
		#menu ul li a 
		{			
			text-decoration: none;
			padding-left: 0.167em;
			padding-right: 0.167em;
			display: block;
			height: 1.5em;
			border: 0.2em dotted orange;
		}
		#menu ul li a:hover
		{
			display: block;
			color: #ffa10d; 
			background: #fff; 
			border-bottom: 0.167em solid #025f8b;
		}
		#menu ul li ul 
		{			
			display: none;			
			position: absolute;
			/*margin: auto auto;*/
			/*left: 0em;*/
			/*top: 1.75em;*/			
			height: 1.75em;			
			color: #333333;			
			background: #92b6ff; /* diagnostic background color */			
			border: 0.1em dotted red;
			width: 100%;
		}				
		#menu li:hover ul 
		{			
			display: block;			
			z-index: 100;		
		}				
		#menu li:hover ul li 
		{			
			background: none;		
		}				
		#menu li:hover ul li a:hover
		{			
			color: #ffa10d; 
			background: #fff; 
		}	
	</style>	
</head>
<body>
  <div id="container">		
	<div id="inside"> 
		<div id="navcontainer">
			<div id="menu">
				<ul>
					[*]Home
					[*]Conoscere
						<ul>
							[*]Cittadina
							[*]Statistiche
							[*]Sport
							[*]Associazioni
							[*]InformazioniUtili
							[*]LocaliPubblici
							[*]Galleria
						[/list]
					
					[*]Servizi
					[*]Documenti
						<ul>
							[*]DeliberediConsiglio
							[*]DeliberediGiunta
							[*]Regolamenti
							[*]Altridocumenti
						[/list]
					
					[*]PrgOnline
					[*]Links
					[*]Contatti
				[/list]
			<div>
		</div>
	</div>
  </div>
</body>
</html>

Grazie a tutti in anticipo per le possibili dritte!
Ciao
Luigi