The CSS  rotateY()  function rotates an element around its vertical y-axis. Specifically, it horizontally flips an element from left to right (or right to left for that matter). It is one of many transform functions used along with the  transform  property. The y-axis is the axis of rotation, so the element turns horizontally. Imagine a pin is stuck to the top of an element and it can only rotate left or right. .demo-element { transform: rotateY(var(--deg)); transition: transform 0.3s ease; } The  rotateY()  function is defined in the  CSS Transforms Module Level 2  specification.…