Centrare un blocco di pulsanti con un div generico

[missers]

Ciao a tutti,
ho bisogno di aiuto. Ho creato dei pulsanti e li ho ben posizionati sulla mia pagina, li ho posizionati ad una posizione specifica pensando che andasse bene su ogni risoluzione ma poi cambiando risoluzione ovviamente cambiava la posizione di tutti i pulsanti.

Da tenere prensente che i pulsanti sono distanziati tra loro; ho eliminato la posizione iniziale, per cui ora partono da 0 e sono tutti a sinistra e ho creato un div generico che racchiudesse il blocco pulsanti.

Vorrei riuscire a centrare questo blocco nella pagina e vorrei che cambiando risoluzione fossero sempre centrati, quali sono le proprietà da dare al div pulsanti?


vi riporto il css:
_______________

#pulsanti { ecco questo dovrebbe essere il blocco che mi regola tutti i pulsanti
z-index: 10;
display: block;
left: 50%;
right: 50%;
position: fixed;
}


#uno {
position: fixed;
top: -90px;
left: 0px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}

#uno:hover {
position: fixed;
left: 0px;
top: -60px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}

#due {
position: fixed;
left: 60px;
top: -95px;
-o-transition: all .5s ease-in-out;
display: block;
z-index: 10;
}

#due:hover {
position: fixed;
left: 60px;
top:-60px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}

#tre {
position: fixed;
left: 110px;
top: -95px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}

#tre:hover {
position: fixed;
left: 110px;
top:-60px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}


#quattro {
position: fixed;
left: 163px;
top: -95px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}

#quattro:hover {
position: fixed;
left: 163px;
top:-60px;
-o-transition: all .5s ease-in-out;
z-index: 10;

}

#cinque {
position: fixed;
left: 210px;
top: -95px;
z-index: 10;
-o-transition: all .5s ease-in-out;
}

#cinque:hover {
position: fixed;
left: 210px;
top: -60px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}



#sei{
position: fixed;
left: 250px;
top: -95px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}


#sei:hover {
position: fixed;
left: 250px;
top:-60px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}



#sette {
position: fixed;
left: 303px;
top: -90px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}



#sette:hover {
position: fixed;
left: 303px;
top:-60px;
-o-transition: all .5s ease-in-out;
z-index: 10;
}


______________


Grazie infinite

[Simo990]

Ciao, non è del tutto chiaro cosa vuoi ottenere. Questi pulsanti devono stare tutti sullo stesso punto al centro dello schermo?

[missers]

oddio qualcuno che mi risponde! GRAZIE SIMONE!
allora dunque questi pulsanti sono striscioline che partono dall'alto non sono attaccati, sono distanziati l'un l'altro da 5px più o meno, ora io questo blocco l'ho racchiuso in un div generico perché speravo che fosse il div a centrarmeli per bene (perché con i css ho impostato i valori esattamente ma poi se cambio risoluzione o se faccio ctrl - sullo schermo i pulsanti si spostano e non rimangono più centrati con i valori che avevo messo)...

ora si è capito un po' di più? non so come fare

[Simo990]

Scusa ma continuo a non capire... i pulsanti sono allineati verticalmente od orizzontalmente?

Comunque se ti serve di centrare il blocco contenitore dei pulsanti a prescindere dalla risoluzione, innanzitutto ti conviene dargli delle misure fisse. Prova così

width:800px; /*la larghezza dell’elemento*/
height:800px; /*l’altezza dell’elemento*/
position: absolute; /*posizione assoluta per poter riposizionare l’elemento*/
left: 50%; /*il bordo sinistra dell’elemento si troverà al 50% della larghezza disponibile*/
top: 50%; /*il bordo superiore dell’elemento si troverà al 50% dell’altezza disponibile*/
margin-left: -400px; /*la metà della larghezza dell’elemento è tolta come margine superiore per centrarlo*/
margin-top: -400px; /*la metà dell’altezza dell’elemento è tolta come margine superiore per centrarlo*/