JSFiddle - React, Tailwind, and code Playground

by Joren Wouters

HTML

<div class="portfolio-item">
				<a href="#" rel="bookmark">
					<img src="http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg">
					<div class="hover-in">
						<p>Portfolio Name</p>
					</div>
				</a>
			</div>
    <div class="portfolio-item">
				<a href="#" rel="bookmark">
					<img src="http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg">
					<div class="hover-in">
						<p>Portfolio Name</p>
					</div>
				</a>
			</div>
        <div class="portfolio-item">
				<a href="#" rel="bookmark">
					<img src="http://www.joomlaworks.net/images/demos/galleries/abstract/7.jpg">
					<div class="hover-in">
						<p>Portfolio Name</p>
					</div>
				</a>
			</div>

CSS

/* Portfolio */
.portfolio-item {
margin: 0;
width: 33%;
height: auto;
float: left;
padding: 0;
}
.portfolio-item .attachment-post-thumbnail {
margin: 0;
height: 100%;
width: 100%;
transition: .5s;
}