Что значит transform: translateX(-50%)?

Question

[TraveWEB]

Начиная разбираться с позиционированием столкнулся с такой штукой, и не могу найти про неё ничего.

Comments

[Модератор]

Завязывайте со спамом в тегах.

[TraveWEB]

Модератор, я извиняюсь, но разве запрещено спрашивать про теги?

[Алексей Уколов]

Спрашивать не запрещено, запрещено добавлять к вопросу теги, которые ему не подходят. Ознакомьтесь с правилами: https://qna.habr.com/help/rules

[TraveWEB]

Алексей Уколов, понял, спасибо.

Answer 1

[Арсений Матыцин]

Плохо искал: https://developer.mozilla.org/ru/docs/Web/CSS/transform

Конкретно это — смещение по X-корам влево относительно самого объекта смещения.

Comments

[TraveWEB]

Спасибо

Answer 2

[Антон Литвиненко]

Это сдвиг элемента по оси x влево на 50%.
Часто применяется при выравнивании фиксированного элемента у которого неизвестна ширина по центру.
Например:

.modal {
  position: fixed;
  top: 10%;
  left: 50%;
  transform: translateX(-50%);
}