.box{ float:left; width: 10%; height: 100px; background-color: #fff; opacity: 0.1; transition-property: opacity; transition-duration: 1s; transition-timing-function: linear; transition-delay: 0s; } .box:hover{ opacity: 1; }
.expand{ width: 20%; height: 50px; padding: 5%; background-color:#333; transition-property: width, height, background-color; transition-duration: 2s; transition-timing-function: ease; transition-delay: 0s; } .expand:hover{ width: 90%; height: 200px; background-color: #f00; }