JSFiddle - React, Tailwind, and code Playground

by Torstein Hønsi

HTML

<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic" media="all">

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

<div style="font-family: 'PT Sans', sans-serif">
Preloader
</div>
<div id="container">

</div>

<pre id="log">

</pre>

CSS

#container {
    max-width: 400px;
}
p {
    font-family: 'PT Sans', sans-serif;
}

JavaScript

var ren = new Highcharts.Renderer(
    document.getElementById('container'),
    400,
    400
);

alert('PT Sans loaded? ' + document.fonts.check("1em 'PT Sans'"));

    var lbl = ren.label(
        'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.',
        100,
        10
    )
    .attr({
        stroke: 'blue',
        'stroke-width': 1
    })
    .css({
        fontFamily: "'PT Sans', sans-serif",
        width: '200px'
    })
    .add();