Text Centering Mit CSS funktioniert nicht in IE
-
09-06-2019 - |
Frage
Ich habe Probleme von Text in einer Tabelle immer in IE zentriert erscheinen.
In Firefox 2, 3 und Safari alles gut funktionieren, aber aus irgendeinem Grunde, wird der Text nicht in IE zentriert erscheinen 6 oder 7
Ich bin mit:
h2 {
font: 300 12px "Helvetica", serif;
text-align: center;
text-transform: uppercase;
}
Ich habe auch versucht, das Hinzufügen margin-left:auto;
, margin-right:auto
und position:relative;
ohne Erfolg.
Lösung
Die Tabellenzelle muss das text-align: center
.Andere Tipps
CSS text-align Eigenschaft sollte auf dem übergeordneten Element deklariert werden und nicht das Element, das Sie Zentrum versuchen. IE verwendet text-align: center Immobilien zum Zentrum Text. Firefox verwendet margin:. 0 Auto und es hat auf dem Element deklariert werden Sie zum Zentrum versuchen
<div style="text-align: center">
<h2 style="margin: 0 auto">Some text</h2>
</div>
Könnte ein Tippfehler sein, aber Sie vermissen ein Semikolon hier:
margin-left:auto; margin-right:auto position:relative;
Sollte sein:
margin-left:auto; margin-right:auto; position:relative;
Wenn das nicht funktioniert, stellen Sie sicher, dass das Element, das Sie versuchen, den Text zu zentrieren auf einige Breite hat. Versuchen Sie, die Breite auf 100% und sehen, ob sich etwas ändert.
sollte die text-align: center
ausreichend sein, da Sie den Text in einem Blockelement sind Zentrierung (h2) -. Die Ränder Einstellung wird die Position des Blocks ändern, nicht der Text
Ich frage mich, ob es nur, dass der IE einen Dummy-Spieß zu dieser font
Erklärung mit hast du da?
Verwenden Sie text-align:. Zentrum in der div / td, die die h2 umgibt
<table style = "width:400px;border:solid 1px;">
<tr>
<td style = "text-align:center;"><h2>hi</h2></td>
</tr>
</table>
edit: wow, Stackoverflow-Community ist ziemlich schnell
Wenn Sie / wollen Flexbox verwenden, können Sie das folgende als auch verwendet werden.
display: flex;
justify-content: center;
align-items:center