TranslateX и перевести Y на тот же элемент?

Можно ли применить CC-перевод X и Y на один и тот же элемент?

Если я попробую это, translateX переопределяется translateY:

.something { 
        transform: translateX(-50%);
        transform: translateY(-50%);
}

Ответы

Вы можете сделать что-то вроде этого

transform:translate(-50%,-50%);

В вашем случае вы можете применять как переводы X, так и Y с помощью свойства translate:

transform: translate(tx[, ty]) /* one or two <translation-value> values */

для вашего примера, он будет выглядеть следующим образом:

.something { 
  transform: translate(-50%,-50%);
}

DEMO:

div{
  position:absolute;
  top:50%; left:50%;
  width:100px; height:100px;
  transform: translate(-50%,-50%);
  background:tomato;
}

<div></div>

Вы можете комбинировать X и Y в одном выражении:

transform: translate(10px, 20px); /* translate X by 10px, y by 20px */

И, в общем, несколько преобразований в одно правило:

transform: translateX(10px) translateY(20px) scale(1.5) rotate(45deg);