Building ferris wheel - Challenge 11

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%;
}

Because there are six of them.

If you add (temporarily) this line of css to .cabin, you’ll be able to see them:

border: 2px solid black;