JSFiddle - React, Tailwind, and code Playground

by Nikola Mihin

HTML

<div class="parent">
    <div class="child">Child</div>
</div>

CSS

.parent {

    height:100%;

    width:100%;

    background-color:#f5f5f5;

    position:relative;

}

.parent .child {

    font-size:3em;

    padding:1em;

    float:left;

    background-color:#111;
    
    color:#fff;

}

JavaScript

Example.init();

$(window).resize(function() {
        Example.resize();
})

var Example = {
    init: function() {
        this.fontSize();
    },
    fontSize: function() {
            winh = $(window).height();
            winw = $(window).width();
            var s = 11;
            $('.parent').css('font-size', winw / (s * 0.65) + '%'); 
    }         
}