JSFiddle - React, Tailwind, and code Playground

HTML

<div class="font-size-equals-width">
    <h1>Here's a headline</h1>
    <p>Here's some paragraph text</p>
</div>

CSS

.font-size-equals-width
{
    padding: 5%;
    border: 1px solid black;
}

.font-size-equals-width h1 { font-size: 0.2em; }
.font-size-equals-width p { font-size: 0.1em; }

JavaScript

function scaleFontSize ( ) 
{
   $('.font-size-equals-width').each(function()
   { 
       var thisContainer = $(this); 
       thisContainer.css('font-size', thisContainer.width().toString() + 'px');
   }    
}

$(window).resize(function ( ) 
{
    scaleFontSize();       
});
    
$(document).ready(function()
{
    scaleFontSize();   
}