Hamacs Vendus
0
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.rectangle {
position: relative;
width: 300px;
height: 150px;
}
.red {
position: absolute;
left: 0;
top: 0;
width: 50%;
height: 100%;
background-color: red;
transition: width 0.3s ease;
}
.blue {
position: absolute;
right: 0;
top: 0;
width: 50%;
height: 100%;
background-color: blue;
transition: width 0.3s ease;
}
.rectangle:hover .red {
width: 100%;
}
.rectangle:hover .blue {
width: 0;
}