JSFiddle - React, Tailwind, and code Playground

by Sascha

HTML

<!DOCTYPE html>
<html>
<head>
<style>@font-face {
    font-family: MyFont;
    src: url("file:///android_asset/printer/fonts/DroidSansMono.ttf")
}
<style>
div{
}
 span{
    word-wrap:break-word;
     white-space: normal;
}

 .doubleHeight {
    -webkit-transform: scaleY(2);
    -moz-transform: scaleY(2);
    -ms-transform: scaleY(2);
    -o-transform: scaleY(2);
    transform: scaleY(2);
} 
 
 .origin {
    -webkit-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    transform-origin: 0 0;
} 

 .doubleWidth {
    -webkit-transform: scaleX(2);
    -moz-transform: scaleX(2);
    -ms-transform: scaleX(2);
    -o-transform: scaleX(2);
    transform: scaleX(2);
     display: inline-block;
}  
.container{
    background:red;
    letter-spacing:-2.3px;
    max-width: 372px;
     font-family: MyFont;
    font-size:19px;}
 

</style>
</head>
<body>

<div class = "container">
<div class="origin doubleWidth">DOUBLE&nbsp;WIDTH&nbsp;TEXT&nbsp;DOUBLE&nbsp;WIDTH&nbsp;TEXT&nbsp;DOUBLE&nbsp;WIDTH&nbsp;TEXT&nbsp;DOUBLE&nbsp;WIDTH&nbsp;TEXT<br/></div>
</div>

</body>
</html>

CSS

div.doubleWidth {
  display: block;
  
}