JSFiddle - React, Tailwind, and code Playground

by karthick6891

HTML

<!-- position absolute relative -->
<p>Scroll to the left to see my image, positioned 500 pixels from the left and 500 pixels down from the top of the browser window.</p>

<div style="position: absolute; left: 0; top: 0;">
    <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/SIPI_Jelly_Beans_4.1.07.tiff/lossy-page1-256px-SIPI_Jelly_Beans_4.1.07.tiff.jpg" width="50" height="50" border="0" alt="Jennifer Kyrnin, About Web Design Guide" />
</div>

<div style="border:1px solid green; width:20px; height:20px;position:relative;"></div>

<div style="border:1px solid green; width:400px; height:200px;position:relative; left:10px;top:10px">
    <!-- it wont work has to be position relative now its static--> 
    <p style="top:20px;left:10px;">Scroll to the left to see my image, positioned 500 pixels from the left and 500 pixels down from the top of the browser window.</p>
    <div style="position: absolute; left: 0; top: 0;">
        <img src="http://upload.wikimedia.org/wikipedia/commons/thumb/b/b6/SIPI_Jelly_Beans_4.1.07.tiff/lossy-page1-256px-SIPI_Jelly_Beans_4.1.07.tiff.jpg" width="50" height="50" border="0" alt="Jennifer Kyrnin, About Web Design Guide" />
    </div>

</div>