СВОЙСТВО TRANFORM-ORIGIN

Свойство transform-origin позволяет изменять положение трансформированных элементов.

Поддержка браузеров


10+

transform-origin: x-ось y-ось z-ось|initial|inherit

Значение	Описание
х-ось	Изменять положение по оси Х. Допустимые значения: left center right единицы измерения %
у-ось	Изменять положение по оси Y. Допустимые значения: top center bottom единицы измерения %
z-ось	Изменять положение по оси Z в единицах измерения.
initial	Устанавливает значение по умолчанию.
inherit	Унаследует значение свойства от родительского элемента.

<div class="block"></div>

HTML

.block {
    background: blue;
    width: 150px;
    height: 150px;
    transform: rotate(60deg);
    transform-origin: 30% 50%
}

CSS