<div>
  hello vmin vmax
</div>

body {
  background-color: lavender;
}

div {
  width: 50vmin; /* 화면의 넓이 중 작은 값을 기준으로 50% */
  height: 50vmax; /* 화면의 넓이 중 큰 값을 기준으로 50% */
  background-color: yellow;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.