css3可以实现为多个子元素添加一个动画吗？

Question

父类.cart，子类.sofa，类.now表示-把.cart整体向右移动后的样式

.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;

}
遇到的问题就是：向右移动的时候，类.sofa子元素自动下移，css能做我描述的问题吗？或者有人知道怎么修改吗？或者除了为每个元素添加动画，还有其他解决思路吗？