CSS: trasformare: translate (-50%, -50%) rende testi sfocate

Question

voglio centrare il mio div e io uso questo metodo, ma rende i miei testi all'interno del div sfocata:

<!-- language: lang-css --> 

#div { 
    top: 50%; 
    left: 50%; 
    -webkit-transform: translate(-50%, -50%); 
    transform: translate(-50%, -50%); 
} 

è c'è un modo per centrare il mio div?

Answer 1

Aggiungi questi stili attorno ai blocchi di elementi che stai traducendo per correggere l'anti-aliasing, Traduci asse Z per avere un valore zero.

-webkit-font-smoothing: subpixel-antialiased; 
-webkit-transform: translateZ(0) scale(1.0, 1.0);