JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
 
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Tabs - Default functionality</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />
    <script>
    $(function() {
      var dg = $("#dialog");
      dg.dialog( {
          minHeight: 200,
    			width: 80,
    			modal: true,
    			draggable: false,
    			resizable: false,
      position: 'center'
      });
      
     dg.dialog("widget").animate({
    			width: '400px',
    			height: '400px'
    		}, {
    			duration: 500,
    			step: function() {
    				dg.dialog('option', 'position', 'center' );
    			},
      complete: function( evt ) {
      dg.html( "<span class='big'>YA!</span>" );
      }
    });      
      
      
    });
    </script>
</head>
<body>

  <div id='dialog'></div>
  
</body>
</html>

CSS

.big
{
  font-size: 200px;
}