given that in its parent element width and height are both set to 55vw
that it means the 20% width and 20% of height of .cabin (its child element) is referred to 55vw (=55% of the full viewport’s width)
both height and width in .cabin are 20%, so why the height is much bigger than the width when shown on the screen?
.cabin {
background-color: red;
width: 20%;
height: 20%;
}