parent class .cart, subclass .sofa, class .now represents-style after moving .cart to the right as a whole
.screen4 .cart {
height:346px;
background: url("../images/04-cart.png") no-repeat center bottom;
text-align: center;
margin-top:0px;
}
.screen4 .cart .sofa {
position: absolute;
top: 180px;
left: 380px;
transform:rotate(45deg);
opacity: 0;
}
.screen4.now .cart .sofa {
opacity: 1;
}
.screen4.Now .cart {
transform: translateX(1000px);
transition: transform 5s linear;
The problem encountered by }
is: when you move to the right, the class. Soap child element automatically moves down, can css do the problem I described? Or does anyone know how to change it? Or are there any other solutions besides animating each element?