JSFiddle - React, Tailwind, and code Playground
HTML
<h3>
Basic
</h3>
<p><img src="https://images.generated.photos/UT_kgWnift8890jHtSvUksPbAj_dK7YV5PTwnvm2s4o/rs:fit:512:512/wm:0.95:sowe:18:18:0.33/Z3M6Ly9nZW5lcmF0/ZWQtcGhvdG9zL3Yz/XzA3NTE2MzAuanBn.jpg" alt="" />Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam consequat scelerisque orci vel vestibulum. Sed ac orci neque. Nam vitae est dolor. In at mi pellentesque dui condimentum porttitor. Suspendisse potenti. Nulla erat est, ullamcorper venenatis quam in, imperdiet lobortis turpis. In non ultrices leo. Ut aliquet aliquam eros vitae fermentum. Nunc interdum interdum tincidunt. Nulla malesuada sed arcu in hendrerit. Fusce venenatis purus vel elit euismod viverra. Ut ut auctor sapien, non malesuada purus. Sed pretium, nunc in dapibus efficitur, ligula leo tempor nunc, non consequat risus felis at massa.
</p>
<h3>
Image right - class on image
</h3>
<p><img class="image-right" src="https://images.generated.photos/UT_kgWnift8890jHtSvUksPbAj_dK7YV5PTwnvm2s4o/rs:fit:512:512/wm:0.95:sowe:18:18:0.33/Z3M6Ly9nZW5lcmF0/ZWQtcGhvdG9zL3Yz/XzA3NTE2MzAuanBn.jpg" alt="" />Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam consequat scelerisque orci vel vestibulum. Sed ac orci neque. Nam vitae est dolor. In at mi pellentesque dui condimentum porttitor. Suspendisse potenti. Nulla erat est, ullamcorper venenatis quam in, imperdiet lobortis turpis. In non ultrices leo. Ut aliquet aliquam eros vitae fermentum. Nunc interdum interdum tincidunt. Nulla malesuada sed arcu in hendrerit. Fusce venenatis purus vel elit euismod viverra. Ut ut auctor sapien, non malesuada purus. Sed pretium, nunc in dapibus efficitur, ligula leo tempor nunc, non consequat risus felis at massa.
</p>
<h3>
Image right - class on span wrapping the image
</h3>
<p><span class="image-right"><img src="https://images.generated.photos/UT_kgWnift8890jHtSvUksPbAj_dK7YV5PTwnvm2s4o/rs:fit:512:512/wm:0.95:sowe:18:18:0.33/Z3M6Ly9nZW5lcmF0/ZWQtcGhvdG9zL3Yz/XzA3NTE2MzAuanBn.jpg" alt="" /></span>Lorem ipsum...
CSS
p{
line-height:1.5em;
}
p img{
display:block;
float:left;
margin:0 15px 0 15px;
width:100%;
max-width:200px;
}
p img.image-right{
float:right;
}
p img.image-left{
float:left;
}
p span.image-left{
display:block;
float:left;
margin:0 15px 0 15px;
width:100%;
max-width:200px;
}
p span.image-right{
float:right;
}
p span >img{
display:block;
width:100%;
max-width:200px;
}