Menu centrato, dov'è il problema?

[emmeteo]

Ciao a tutti
ho un problema con un menu: sto usando un template già pronto che mi visualizza il menu a sinistra, ho fatto delle modifiche ma ora non riesco a centrarlo, potreste aiutarmi?

Il codice css è questo:

#container { 	margin: 0 20px; 	background: #fff;                           }  #header { 	background: white; 	padding: 1px;          }  #header h1  {  margin: 0; color: #black; font-size: 2.9em; text-align:center;   }  #navigation {                 margin: 10px;         margin-bottom:0px; 	float: left; 	width: 100%; 	background: white;          }  #navigation ul { 	margin: 0; 	padding: 0;          }  #navigation ul li { 	list-style-type: none; 	display: inline;                        }  #navigation li a  {                margin-left:0px;         padding: 2px 7px; 	color: black; 	text-decoration: none; 	border-right: 1px solid grey;         font-size:1.1em; }  #navigation li a:hover { background: #F2F2F2; }

#container { 	margin: 0 20px; 	background: #fff;                           }  #header { 	background: white; 	padding: 1px;          }  #header h1  {  margin: 0; color: #black; font-size: 2.9em; text-align:center;   }  #navigation {                 margin: 10px;         margin-bottom:0px; 	float: left; 	width: 100%; 	background: white;          }  #navigation ul { 	margin: 0; 	padding: 0;          }  #navigation ul li { 	list-style-type: none; 	display: inline;                        }  #navigation li a  {                margin-left:20px;         padding: 2px 7px; 	color: black; 	text-decoration: none; 	border-right: 1px solid grey;         font-size:1.1em; }  #navigation li a:hover { background: #F2F2F2; }

Il file html invece:

<div id="container"> 	<div id="header"> 		<h1> 			<?php print("$variabile");?> 		</h1> 	</div> 

 <div id="navigation"> 		<ul>                              			[*]Home 			[*]uno 			[*]due 			[*]tre[*]quatto[*]cinque[*]sei  		[/list]	</div>

non riesco proprio a capire dove sbaglio, in qualunque modo provi a centrarlo non ci riesco..
Grazie a tutti in anticipo
ciao

[emmeteo]

scusate per sbaglio ho postato 2 volte il codice css.
non c'è un metodo per postarlo in maniera più leggibile, senza dover scorrere la barra per leggerlo?

[ResianTaxidrive]

ma se l'id=navigation è float:left non ti si può centrare. NOn devi usare quel float e devi mettergli un margin-right:auto e margin-left:auto

[emmeteo]

ah ecco! grazie tante
ciao

[emmeteo]

niente.. ho provato come dici tu ma addirittura così scompare lo sfondo di navigation.

il template che sto usando è questo: http://www.maxdesign.com.au/articles...ts/one-liquid/.

bo

[ResianTaxidrive]

allora diciamo che puoi togliere il float a navigation e mettergli l'altezza in px, tanto si suppone che il menu non vada a finire su due righe. Poi credo che non ci sia altra alternativa che mettere una larghezza al <ul> e poi il margin:0 auto.

ANche io ho difficoltà in questa situazione e finora non ho trovato un'altra soluzione.

[emmeteo]

grazie mille
su firefox funziona alla perfezione.. adesso purtroppo bisogna sistemarlo per IE, che tragedia

[ResianTaxidrive]

come sarebbe^ non funziona su IE? mi sembra strano.

[emmeteo]

e certo IE interpreta in modo tutto suo i css, comunque ho risolto:
per firefox ho fatto come hai detto tu,
per internet explorer ho usato http://css.html.it/articoli/leggi/31...i-css-per-ie6/ : "centrare un elemento con i css" (in fondo alla pagina).
ora manca solo da sistemare lo spessore di navigation su IE che è magicamente cambiato.

[ResianTaxidrive]

ah ma stiamo parlando di ie6?
e cosa c'è di diverso? il text-align:center?