JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
    <script type="text/javascript">

      $(window).load(function()
      {
        $(window).resize(showSize);
        showSize();
      });

      function showSize()
      {
        var div = $("#main");
        var divText = $("#maintext");
        div.width(500);
        div.height(400);
        divText.html("outerWidth(true)="+div.outerWidth(true)+"<br>"+
                     "outerHeight(true)="+div.outerHeight(true)+"<br>"+
                     "outerWidth(false)="+div.outerWidth(false)+"<br>"+
                     "outerHeight(false)="+div.outerHeight(false)+"<br>"+
                     "width="+div.width()+"<br>"+
                     "height="+div.height());

        div = $("#inner");
        div.width(300);
        div.height(250);
        div.html("outerWidth(true)="+div.outerWidth(true)+"<br>"+
                 "outerHeight(true)="+div.outerHeight(true)+"<br>"+
                 "outerWidth(false)="+div.outerWidth(false)+"<br>"+
                 "outerHeight(false)="+div.outerHeight(false)+"<br>"+
                 "width="+div.width()+"<br>"+
                 "height="+div.height());
      }

    </script>
    </head>
  <body style="margin:0px; padding:0px">

    <div id="main" style="background-color:#aaaaaa">
      <div id="maintext" style="height:150px"></div>
      <div id="inner" style="background-color:#aa0000; color:white">
      </div>
    </div>

  </body>
</html>