Scale any text in fixed-size <div> as much as possible

by Kaloyan Kosev

HTML

<header>
  <h1>
     This is example title, but the text length might be different. What is the optimal font size of the text to fit the header bounds?
  </h1>
</header>

CSS

header {
  width: 300px;
  height: 200px;
  border: 1px solid red;
}
h1 {
  margin: 0;
  /**
   * Dynamic font-size,
   * that scales text as much as possible,
   * without exceeding the <header> bounds,
   * is this possible?
  */
  font-size: 40px;
}