JSFiddle - React, Tailwind, and code Playground

by Chris Nicholson

HTML

<article>
    <h1>Lorem ipsum dolor</h1>
    
    <img src="http://lorempixel.com/500/300" class="left" />
    
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam sit amet diam in neque venenatis semper et et dui. Nam risus ante, condimentum id neque ac, faucibus molestie purus. Pellentesque viverra ultrices lacus, sed vulputate diam lobortis fermentum.</p>
    <p>Sed tincidunt tortor in lectus imperdiet bibendum. Nullam pellentesque commodo lacus, eget consequat erat convallis ut. Donec scelerisque urna urna, at aliquam nulla sagittis eu. Proin sit amet sagittis est. Phasellus tempor orci sem, id facilisis nibh tincidunt non.</p>
    
    <h2>Sit amet</h2>
    
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam sit amet diam in neque venenatis semper et et dui. Nam risus ante, condimentum id neque ac, faucibus molestie purus. Pellentesque viverra ultrices lacus, sed vulputate diam lobortis fermentum.</p>
    
    <!--<img src="http://lorempixel.com/500/300" class="right" />-->
    
    <p>Sed tincidunt tortor in lectus imperdiet bibendum. Nullam pellentesque commodo lacus, eget consequat erat convallis ut. Donec scelerisque urna urna, at aliquam nulla sagittis eu. Proin sit amet sagittis est. Phasellus tempor orci sem, id facilisis nibh tincidunt non.</p>
        
    
</article>

CSS

article {
    margin: 0 auto;
    max-width: 500px;
}

img.left {
    margin: 0 20px 20px -300px;
    float: left;
}

img.right {
    margin: 0 -300px 20px 20px;
    float: right;
}