Centrare una lista

[pappolo]

Salve a tutti, ho una lista i cui elementi si dispongono in orizzontale e vorrei centrarla all'interno di un div che la contiene, ho provato in tutti i modi che conosco e non ci sono riuscito... come posso fare?

Questa è la lista:

<div id='counter' class='counter'> 	<ul class="countdown">
 		[*]<div class='countdown_num' id='countdown_day'></div><div>Giorni</div>
 		[*]<div class='countdown_num' id='countdown_hour'></div><div>Ore</div>
 		[*]<div class='countdown_num' id='countdown_min'></div><div>Minuti</div>
 		[*]<div class='countdown_num' id='countdown_sec'></div><div>Secondi</div>
 	[/list]</div>

e questo è il CSS

.counter{ 	width: 100%; margin:0 auto;  }
.counter ul.countdown{
 	list-style-type: none;
 	color: white;
 	font-weight: bold;
 	text-align: center;
        margin:0 auto; }
.counter ul.countdown li{
 	float: left;
 	background: url(digit.png) no-repeat;
	height:78px;
 	width: 75px;  	 }
.counter ul.countdown li div{ 	font-size: 12px; }
.counter ul.countdown li div.countdown_num{ padding-top: 15px;
 	font-size: 18px; }

Ho provato con l'align:center al div, ho provato con il margin: auto alla lista ed al div, ma nulla..

Qualche idea?
Grazie

[Prill]

Ciao, se assegni al tuo elenco una larghezza precisa col margin:0 auto; lo centrerai

[pappolo]

Ciao

l'ho trasformato così

.counter{ 	width: 100%; margin:0 auto;  }
.counter ul.countdown{
width:320px;
 	list-style-type: none;
 	color: white;
 	font-weight: bold;
 	text-align: center;
        margin:0 auto; }
.counter ul.countdown li{
 	float: left;
 	background: url(digit.png) no-repeat;
	height:78px;
 	width: 75px;  	 }
.counter ul.countdown li div{ 	font-size: 12px; }
.counter ul.countdown li div.countdown_num{ padding-top: 15px;
 	font-size: 18px; }

ma rimane sempre allineato a sinistra...

[Prill]

Ciao Pappolo, col codice che hai postato l'elenco risulta centrato (resta poi da capire perché inserisci nelle voci elenco tutti quei div, ma comunque l'allineamento si ha)

[pappolo]

Originariamente inviato da Prill
Ciao Pappolo, col codice che hai postato l'elenco risulta centrato (resta poi da capire perché inserisci nelle voci elenco tutti quei div, ma comunque l'allineamento si ha)

lo so non è proprio una soluzione molto lineare, ma era l'unica per poter fare quello che mi serviva (o almeno l'unica che mi è venuta in mente )

Cmq i singoli elementi della lista sono centrati, è tutta la lista, ossia l'elemento <ul> che non è centrato all'interno del div, ma allineato a sinistra... ho paura che dovrò allinearlo manualmente con i margin...


Grazie a tutti!

[fcaldera]

http://www.cssplay.co.uk/menus/centered.html


edit: quasi mi dimenticavo di aver scritto anche io qualcosa a riguardo
http://css.html.it/articoli/leggi/27...o-in-puro-css/

ciao