JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
  <head>
    <title>Google Developers</title>
    <link rel="stylesheet" type="text/css" href="/css/screen.css" />
    <link rel="stylesheet" href="//www.google.com/cse/style/look/default.css" type="text/css" />
    <link href='//fonts.googleapis.com/css?family=Open+Sans:300,400' rel='stylesheet' type='text/css'>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
    <script id="jqueryui" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js" defer async></script>
    <script src="//www.google.com/jsapi?key=AIzaSyCZfHRnq7tigC-COeQRmoa9Cxr0vbrK6xw"></script>
    <!--[if lt IE 9]>
    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    
  </head>
<body class="docs framebox_body">
<script type="text/javascript" src="https://www.google.com/jsapi"></script>

    <script type="text/javascript">
 
google.load('visualization', '1.1', {packages: ['corechart']});

google.setOnLoadCallback(initialize);

function drawExample2() {
  // Some raw data (not necessarily accurate)
  var rowData1 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua  Guinea',
                   'Rwanda'],
                  ['2004/05', 165, 938, 522, 998, 450],
                  ['2005/06', 135, 1120, 599, 1268, 288],
                  ['2006/07', 157, 1167, 587, 807, 397],
                  ['2007/08', 139, 1110, 615, 968, 215],
                  ['2008/09', 136, 691, 629, 1026, 366]];
  var rowData2 = [['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua  Guinea',
                   'Rwanda'],
                  ['2004/05', 122, 638, 722, 998, 450],
                  ['2005/06', 100, 1120, 899, 1268, 288],
                  ['2006/07', 183, 167, 487, 207, 397],
                  ['2007/08', 200, 510, 315, 1068, 215],
                  ['2008/09', 123, 491, 829, 826, 366]];

  // Create and populate the data tables.
  var data = [];
  data[0] =...

CSS

.container {
    width: 3000px;
}
p {
    clear: both;
}
#example2-visualization{
    float: left;
    width: 200px;
    display: block;
    border: 1px solid red;
} 
#pie_div {
    float: left;
    width: 200px;
    display: block;
    border: 1px solid green;
}
#chart_div {
    float: left;
    width: 200px;
    display: block;
    border: 1px solid blue;
}