Salve a tutti mi sto avvicinando ora ai css con i div ma non capisco ancora bene il funzionamento, ho una struttura del genere

<div class="contenitore">
<div class="titolo"><p class="ptitolo">Titolo</p></div>
<div class=contenuto"><p class="testo">contenuto</p></div>
<div class="allinea_bottone"><input type="button" value="Bottone" class="bottone" /></div>
</div>
Sono riuscito a centrare il contenitore rispetto alla pagina, vorrei poi che il titolo sia allineato al centro per quanto riguarda il verticale e a sinistra per l'orizzontale, invece centrati sia in orizzontale che in verticale sia il contenuto che il bottone

.testo {
font-family: verdana, sans-serif;
margin:0px 0px 0px 0px;
font-size: 12px;
color: #00CC33;
}
div.contenitore {
position: absolute;
border:1px solid #00CC33;
width:400px;
height: 200px;
top: 50%;
left: 50%;
margin-left: -200px;
margin-top: -100px;
}
div.titolo{
position: relative;
font-family: verdana, sans-serif;
background-color:#00CC33;
color:White;
font-size:75%;
}
div.titolo p.ptitolo{
font-size:160%;
font-weight: bold;
padding:4px;
margin:0px 0px 0px 0px;
}


div.contenuto{
position: relative;
height: 120px;
padding:4px;
}
div.allinea_bottone{
position: relative;
height: 40px;
text-align: center;
}

vorrei poi sapere se questo mi puo dare problemi di compatibilita fra i vari browser Grazie a chi mi vorra aiutare