Nidificare CSS

[Flash20]

Devo realizzare due CSS, uno contenitore e uno all'interno con del testo come da foto allegata:

http://www.whytech.it/cam/esempio.jpg

Ho usato il seguente codice:

<div class="contenitore">
<div class="testo"></div>
</div>


.contenitore {
width:900px;
height: 676px;
margin:auto;
text-align:left;
background-position: bottom;
vertical-align: top;
}
.testo {
width:304px;
height: 210px;
margin: 0;
position: absolute;
left: 480px;
top: 372px;
}

Mi interessa in pratica che il contenitore stia al centro della pagina e che il box del testo stia al suo interno in posizione decentrata, però con il codice che ho utilizzato il box testo si sposta a seconda della risoluzione. Come posso fare?
Grazie

 

[dead]

usa le percentuali
prova così, ovviamente aggiustando il valore della percentuale alle tue esigenze.

.contenitore {
width:900px;
height: 676px;
margin:auto;
text-align:left;
background-position: bottom;
vertical-align: top;
background-color:blue;
}
.testo {
width:304px;
height: 210px;
margin: 0;
position: relative;
left: 55%;
top: 60%;
background-color:red;
}

 

[Flash20]

Ok funziona :mavieni:

Bravo :beer:


Grazie mille :tifoso: