CSS: transform: translate (-50%, -50%) делает тексты размытыми

Я хочу центрировать мой div, и я использую этот метод, но мои тексты внутри div размыты:

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

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

есть ли способ центрировать мой div?

Добавьте эти стили вокруг блоков элементов, которые вы переводите, чтобы исправить сглаживание, Перевести ось Z на нулевое значение.

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