JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box_wrapp">

	<div class="box" id="box1">
		
		<div class="b_header">
		Título
		</div><!-- /b_header-->
		
		<div class="b_body"></div><!-- /b_body-->		

	</div><!-- /box1-->
	
	<!-- ... -->	
	
	<div class="box" id="box2">
		
		<div class="b_header">
		Título
		</div><!-- /b_header-->
		
		<div class="b_body"></div><!-- /b_body-->		

	</div><!-- /box2-->
	
	<!-- ... -->
	
	<div class="box" id="box3">
		
		<div class="b_header">
		Título
		</div><!-- /b_header-->
		
		<div class="b_body"></div><!-- /b_body-->
		
	</div><!-- /box3-->

</div><!-- /box_wrapp-->

CSS

.box_wrapp{
	display:inline-block;
	width:100%;
  text-align:center;
}
.box{
	display:inline-block;
	width:150px;
	max-width:90%;
	margin:0 10px 10px 0;
}
.box .b_header{
	display:inline-block;
	width:100%;
  text-align:center;
	padding:10px 0 10px 0;
	font-size:12px;
}
.box .b_body{
	display:inline-block;
	width:100%;
	height:140px;
	border-radius:50%;
	overflow:hidden;	
	font-size:12px;
  background-color:#e8e8e8;
}
#box1 .b_body{
	background:url(pasta/img1.png)no-repeat center;
	background-size:cover;
  background-color:#e8e8e8;
}
#box2 .b_body{
	background:url(pasta/img2.png)no-repeat center;
	background-size:cover;
  background-color:#e8e8e8;
}
#box3 .b_body{
	background:url(pasta/img3.png)no-repeat center;
	background-size:cover;
  background-color:#e8e8e8;
}