Can css3 add an animation to multiple child elements?

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?

Css
Jun.28,2022
MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1eb8001-69e0f.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1eb8001-69e0f.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?