Layout pagina unica - Div sempre centrato

[AltF4]

Ciao a tutti, ho realizzato un layout a pagina unica, dove attraverso l'uso di jQuery cliccando su una voce del menu la pagina si muove in verticale.

Il mio problema è che dovrei centrare verticalmente sempre un DIV, ma non ci riesco, riesco a centrare soltanto il primo, il secondo proprio non si centra.

In pratica esiste una section di altezza 1200px e larghezza 100%, poi ho il primo div centrato in questo modo:

.div1 {
 width: 900px; 
 height: 600px; 
 position: absolute;
 top:50%;
 left:50%;  
 margin-left: -450px;
 margin-top: -300px;
 background-color: #CCCCCC;
   
}

mentre per il secondo, usando le stesse impostazioni, non si centra.

E' possibile un piccolo aiuto?

Grazie in anticipo!

[carlomarangoni]

Prova con:

 width: 900px; height: 600px; margin: 50px auto;

[AltF4]

Immagino che ti riferissi al Div2, ho provato, ma non va, lo posiziona in alto.

[ac_socmel]

mostra un link

[AltF4]

Questo il link:

http://demoaltf4.altervista.org/centerdiv/

[ac_socmel]

è normale metti l'id al div e non alla section

[AltF4]

Scusami, non ho ben capito cosa fare...

[AltF4]

Ho provato a mettere l'id per ogni div, in questo modo:

#div1 {
 width: 900px; 
 height: 600px; 
 position: absolute;
 top:50%;
 left:50%;  
 margin-left: -450px;
 margin-top: -300px;
 background-color: #CCCCCC;
   
}

#div2 {
 width: 900px; 
 height: 600px; 
 position: relative;
 margin: 50px auto;
 background-color: #999999;
   
}

e richiamandoli così:

<div id="div1"> </div>

<div id="div2"> </div>

Ma non cambia nulla, l'effetto è lo stesso.

[AltF4]

Buongiorno, sto continuando a provare a centrare quel famoso DIV, ho aggiornato anche la pagina demo:

http://demoaltf4.altervista.org/centerdiv/

Il problema è che sembrerebbe impossibile poterlo centrare verticalmente, almeno solo con i CSS, forse dovrei utilizzare qualche script?

Mi dareste un aiuto?

Grazie in anticipo.

[ac_socmel]

aggiungi

#box-centro {
 top: 50%;
 margin-top: -301px;
}