JSFiddle - React, Tailwind, and code Playground

HTML

<div id="galleryArea">
    <ul id="gallery">
        <li>
            <a href="#">
                <img src="img/img.png" />
                <p>Desc...</p>
            </a>
        </li>
        <li>
            <a href="#">
                <img src="img/img.png" />
                <p>Desc...</p>
            </a>
        </li>
        <li>
            <a href="#">
                <img src="img/img.png" />
                <p>Desc...</p>
            </a>
        </li>        
        <li>
            <a href="#">
                <img src="img/img.png" />
                <p>Desc...</p>
            </a>
        </li>
        <li>
            <a href="#">
                <img src="img/img.png" />
                <p>Desc...</p>
            </a>
        </li>        
    </ul>
</div>

CSS

#galleryArea {
    margin: 0 auto;
    width: 80%;
}
#gallery {
    list-style-type: none;
    background: #bada55;
    
}