JSFiddle - React, Tailwind, and code Playground

HTML

<div id="N-03-item" style="float:left; ">
            <p><a href="item.php?i=8">
                    <img id="N-03" width="150" src="http://www.weatherreport.com/images/Cumulus_clouds_in_fair_weather.jpg" alt='Choker Necklace 18"'/><br/>
                    
                <div class="description">Frosted Flower Choker Necklace 18"</div>
                </a>
     </p>
</div><br clear="both"/><br clear="both"/>
<p>
    Just wrap the photo description in a div which has a max-width css property of say 150px which is equal to the predefined width of the container N-03-item.
    <p>

CSS

.description{
max-width: 100%; z-index: 1; top: 10px;
}