Course Content
Advanced CSS Techniques
1. Introduction
6. Adaptive/responsive websites and apps
Advanced CSS Techniques
Challenge (translate, skew)
We create the information card about animals. One card has an animal image and a short description. We want to add interactivity to the card by hovering the mouse. The task is:
- add the perspective of
400px
to the parent element that isdiv
with thecontainer
class name; - make a card (
div
with thecard
class name) closer to the user by50px
(translateZ()
can help); - add skew along the x-axis by
10deg
to the card description (div
with thecard-description-wrapper
class name);
Everything was clear?
Section 5. Chapter 8