Margin auto non funziona

[plaf2000]

Non esiste un altro metodo che possa permettere di non dover settare l'altezza?? E poi perché non funziona margin:auto??

[carlomarangoni]

... E poi perché non funziona margin:auto??

Non è questo che non funziona e poi non è questo che allinea verticalomente! Ma:

vertical-align: middle;
non funziona ormai quasi più,.....

Perchè è obsoleto e i browser moderni lo ignorano

[plaf2000]

Non è questo che non funziona e poi non è questo che allinea verticalomente! Ma:Perchè è obsoleto e i browser moderni lo ignorano

Ma allora proprio non hai capito il problema??? Il .centrato non viene centrato ALL'INTERNO DELL'ASIDE #CONTEINER!! Il problema non è il testo del .centrato che non viene centrato, ma tutto l'elementp p!!

Spero abbiate finalmente capito

[plaf2000]

*Spero hai finalmente capito

[Prill]

Manteniamo toni convenienti, grazie.

#container{
 display: table;
 width: 70%;
 height: 100%;
 vertical-align:middle;
}
.centrato{
 display: table-cell;
    padding: 1%;
 width: 50%;
 text-align: center;
 vertical-align: middle;
}

[plaf2000]

Manteniamo toni convenienti, grazie.

#container{
 display: table;
 width: 70%;
 height: 100%;
 vertical-align:middle;
}
.centrato{
 display: table-cell;
    padding: 1%;
 width: 50%;
 text-align: center;
 vertical-align: middle;
}

Hai ragione, mi scuso. Grazie mille per il codice, proverò e ti farò sapere. Ma vertical-align non è obsoleto? E perché margin:auto non viene utilizzato neanche questa volta??

[Prill]

Modifica così:

css:

#container{
 display: table;
 width: 70%;
 height: 100%;
 vertical-align:middle;
 background-color:#CC99CC
}
.centrato{
 display: table-cell;
 vertical-align: middle;
}
.centrato p{
 padding: 1%;
 width: 50%;
 text-align: center;
 margin:0 auto;
 background-color:#996699
}

html:

<section id="section">
 <aside id="container">
  <div class="centrato"><p>Testo centrato</p></div>
 </aside>
</section>

solo ai fini della visualizzazione ho inserito un colore di sfondo.

Aggiungo:

Nel precedente esempio il paragrafo non era centrato orizzontalmente perché occupava tutta la larghezza dell'elemento che lo conteneva (comportandosi come una cella).

Vertical-align non è obsoleto, ma è proprietà non applicabile a tutti gli elementi