JSFiddle - React, Tailwind, and code Playground
HTML
<div class="serviceEntry">
<div class="serviceImg">
<img src="https://hope.rudtek.dev/wp-content/uploads/2020/08/hopewellness-cbt-falls-church-37-1024x668.jpg" class="attachment-large size-large" alt="" srcset="https://hope.rudtek.dev/wp-content/uploads/2020/08/hopewellness-cbt-falls-church-37-1024x668.jpg 1024w, https://hope.rudtek.dev/wp-content/uploads/2020/08/hopewellness-cbt-falls-church-37-300x196.jpg 300w, https://hope.rudtek.dev/wp-content/uploads/2020/08/hopewellness-cbt-falls-church-37-768x501.jpg 768w, https://hope.rudtek.dev/wp-content/uploads/2020/08/hopewellness-cbt-falls-church-37-1536x1001.jpg 1536w, https://hope.rudtek.dev/wp-content/uploads/2020/08/hopewellness-cbt-falls-church-37.jpg 2000w"
sizes="(max-width: 1024px) 100vw, 1024px" width="1024" height="668">
</div>
<div class="serviceContent">
<h3><a href="https://hope.rudtek.dev/services/women/">Women</a></h3>
We provide specialized individual treatment and cognitive behavioral therapy to empower women in all aspects of life, including personal growth, overcoming mood and anxiety disorders, and navigating major life transitions.
</div>
</div>
CSS
.serviceEntry {
display: flex;
margin-bottom: 2rem;
border: 1px solid red;
}
.serviceImg,
.serviceContent {
min-width: 0;
flex: 1;
}
.serviceContent {
color: white;
background-color: #93AEC2;
padding: 0px 10px;
line-height: 2;
}
img {
width: 100%;
height: auto;
vertical-align: bottom;
}