тк 3 июля праздник (в беларуси), буду не онлайн (по возможности буду отвечать)

Функция translateX

Функция translateX задает сдвиг элемента по оси X. Используется совместно со свойством transform. Значением свойства служат любые единицы для размера. Положительное значение сдвигает вправо, отрицательное - влево.

Синтаксис

селектор { transform: translateX(сдвиг); }

Пример

Если навести мышкой на блок - он сдвинется на 30px вправо:

<div id="elem"></div> #elem { border: 1px solid black; width: 100px; height: 50px; } #elem:hover { transform: translateX(30px); }

:

Пример

Если навести мышкой на блок - он сдвинется на 30px влево:

<div id="elem"></div> #elem { border: 1px solid black; width: 100px; height: 50px; } #elem:hover { transform: translateX(-30px); }

:

Смотрите также

  • функцию translate,
    которая задает сдвиг по осям X и Y
  • функцию translateY,
    которая задает сдвиг по оси Y