set the font size of a child element relative to the height of its parent box when the parent box doesn’t have a specified font size

I need to dynamically set the font size of the <span> element relative to the 10% height of the div.

HTML:

<div>
  <span>Example text</span>
</div>

CSS:

div {
  height: 20vh;
  width: 100vh;
  background-color: #f0f0f0;
  position: relative;
}

I tried using vh, vmin, rem, em, % units with no luck.
Is there a way to achieve this with pure CSS? Without relying on JavaScript?