JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<script src="http://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

CSS

div.tooltip {float:left;width:240px;}
div.toolWrapper { float: left;width:120px; }
div.toolTitle { float:left;width: 240px; }

JavaScript

$(function () {
    var chart;
    $(document).ready(function() {
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'line',
                marginRight: 130,
                marginBottom: 25
            },
            xAxis: {
                categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',
                    'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
            },
            yAxis: {
            },
            tooltip: {
                formatter: function() {
                    var html='';
                    html+='<div class="tooltip">';
                    html+='<div class="toolTitle">Title</div>';
                    html+='<div class="toolWrapper">';
                    html+='1-1<br>';
                    html+='1-2<br>';
                    html+='</div>';
                    html+='<div class="toolWrapper">';
                    html+='  2-1<br>';
                    html+='  2-2<br>';
                    html+='</div>';
                    html+='</div>'; 
                    return html;
                },
                useHTML:true
            },

            series: [{
                name: 'Tokyo',
                data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
            }]
        });
    });
    
});