У меня есть элемент, которому заданы transform: perspective(500px)
и transform: translate(0 0 100px)
. Почему элемент не двигается по оси зет?
Кроме того, при добавлении transform: translate
перестает работать rotate
. Что я делаю не так? Большое спасибо.
Мои примеры - 1. Без добавления transform: translate
.block {
display: inline-block;
width: 200px;
height: 200px;
background: pink;
transform: perspective(500px) rotateY(50deg);
outline: 1px solid black;
}
<div class="block"></div>
- С добавлением
transform: translate
.block { display: inline-block; width: 200px; height: 200px; background: pink; transform: perspective(500px) rotateY(50deg) translate(0 0 100px); outline: 1px solid black; }
<div class="block"></div>