JSFiddle - React, Tailwind, and code Playground

by Ahmad Sharif

HTML

<h1>Listing dogs</h1>

 
  <ul>
	  <li>  <a href="/dogs/3"><img alt="Dog 2" src="https://v.cdn.vine.co/r/avatars/1D8A5A9AD81112510785588019200_21ff866832a.1.0.jpg?versionId=0I_eiPNigLBtjlgOMJIQyCYY4fKf2YNs" />
</a>
          <span> Dog 1 </span></li>

        <li>  <a href="/dogs/3"><img alt="Dog 2" src="https://v.cdn.vine.co/r/avatars/1D8A5A9AD81112510785588019200_21ff866832a.1.0.jpg?versionId=0I_eiPNigLBtjlgOMJIQyCYY4fKf2YNs" />
</a>
          <span> Dog 1 </span></li>
	  
  </ul>

CSS

ul > li {
  list-style: none;
   display: inline;
   float: left;
   margin: 0 5px;
}

span {
    display: block;
    width: 100%;
}