Testo di Centraggio Tramite CSS non funziona in IE

Question

Sto avendo dei problemi di testo all'interno di una tabella è centrata in IE.

In Firefox 2, 3 e Safari tutto funzionare bene, ma per qualche motivo, il testo non appare centrato in IE 6 o 7.

Sto utilizzando:

h2 {
  font: 300 12px "Helvetica", serif; 
  text-align: center; 
  text-transform: uppercase;
}

Ho anche provato ad aggiungere margin-left:auto;, margin-right:auto e position:relative;

senza alcun risultato.

Answer 1

La cella di tabella esigenze text-align:centro.

Answer 2

CSS text-align proprietà deve essere dichiarato l'elemento principale e non l'elemento che si sta cercando di centro.IE utilizza text-align:immobile centro per centrare il testo.Firefox utilizza margine:0 auto e deve essere dichiarato l'elemento che si sta cercando di centro.

<div style="text-align: center">
    <h2 style="margin: 0 auto">Some text</h2>
</div>

Answer 3

Potrebbe essere un errore di battitura, ma manca un punto e virgola qui:

margin-left:auto; margin-right:auto position:relative;

Dovrebbe essere:

margin-left:auto; margin-right:auto; position:relative;

Se questo non funziona, assicurarsi che l'elemento che si sta cercando di centrare il testo ha una certa larghezza.Provare a impostare la larghezza al 100% e vedi se cambia qualcosa.

Answer 4

Il text-align: center dovrebbe essere sufficiente, dal momento che si sta centrando il testo all'interno di un elemento di blocco (h2) - impostare i margini per cambiare la posizione del blocco, non il testo.

Mi chiedo se è giusto che IE sta avendo un manichino-sputo in che font dichiarazione sei arrivato lì?

Answer 5

Utilizzare text-align:center div/td che circonda l'h2.

<table style = "width:400px;border:solid 1px;">
    <tr>
        <td style = "text-align:center;"><h2>hi</h2></td>
    </tr>
</table>

edit:wow, stackoverflow comunità è abbastanza veloce!

Answer 6

Se puoi/vuoi utilizzare flexbox, è possibile utilizzare anche il seguente.

display: flex;
justify-content: center;
align-items:center