JSFiddle - React, Tailwind, and code Playground

CSS

body
{
    margin:0px;
    padding:0px;
}

JavaScript

// Header is 50px and footer is 50px; therefore, 100px is of screen height is used
// Define content_height and consider the 100px which has already been used
var content_height=document.body.scrollHeight-100;
//alert(content_height);
content_height = $(window).height() -110;
//alert(content_height);
// Set iframe height
document.getElementById('pdf_frame').style.height=content_height+"px";

// Reset iframe height after window resize
$(function(){
    $(window).resize(function(){
        content_height = $(window).height()-110;
        //var content_height=document.body.scrollHeight-100;

        document.getElementById('pdf_frame').style.height=content_height+"px";
    });
});