JSFiddle - React, Tailwind, and code Playground

by StepBaro

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/dom-to-image/2.6.0/dom-to-image.js"></script>
<div id="myDiv" class="myDiv">
  test
</div>

<div id="result">
  
</div>

CSS

.myDiv {
    width: 100px;
    height: 100px;
    background: red;
    position: absolute;
    left: -100px;
    top: 0;
}

#result {
    position: absolute;
    left: 200px;
    top: 200px;
}

JavaScript

domtoimage.toPng(document.getElementById('myDiv'), {style: {
    'left': '0px'
  }}).then(function (dataUrl) {
		var img = new Image();
    img.src = dataUrl;
    document.getElementById('result').appendChild(img);
    //download(dataUrl, 'myDiv.png');
});