JSFiddle - React, Tailwind, and code Playground

HTML

<section id="you-and-us" class="grey">
		<div class="inner">
			<div class="c-3">
				<h3>You</h3>
				<p>Working closely with you, we live and breathe your brand to create emotionally rewarding and engaging user experiences.</p>
				
				<p>Combining “buy now” with “feel good”, for results today and long-term personal customer relationships tomorrow.</p>
			</div>
			<div class="c-3">
				<div class="block">
				    
				    <div class="centered">
				        <img src="http://placehold.it/50x50" alt="" />
				    </div>
				    
				</div>
				
			</div>
			<div class="c-3">
				<h3>Us</h3>
				<p>We’ve invested heavily in our in-house teams and boost rockstar talented geeks with years of creative, build &amp; test know-how.</p>
				
				<p>We hit the line between creativity that delights and functionality that delivers. It’s the magical difference between “hey, look at this” and “hey?”</p>
			</div>
		</div>
	</section>

CSS

/* This parent can be any width and height */
.block {
  text-align: center;
}
 
/* The ghost, nudged to maintain perfect centering */
.block:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em; /* Adjusts for spacing */
}

/* The element to be centered, can
   also be of any width and height */ 
.centered {
  display: inline-block;
  vertical-align: middle;
}


.inner {
	max-width: 960px;
	margin: 0 auto;
	overflow: hidden;
    background: #ef4;
}

.c-3 {	
	width: 29.3%;
	float: left;
	margin-left: 6%;
    background: #e4f;
}
	
	#you-and-us .c-3 { width: 33.5%; }
	#you-and-us .c-3:first-child { text-align: right; margin: 0; }
	#you-and-us .c-3:nth-child(2) {	width: 21%; text-align: center; position: relative; }