<section>
<div class="container">
<div class="row align-items-center">
<div class="col-6">
<figure>
<img src="https://images.pexels.com/photos/6054110/pexels-photo-6054110.jpeg?auto=compress&cs=tinysrgb&dpr=3&h=750&w=1260" alt="demo">
</figure>
</div>
<div class="col-6">
<h1>About us</h1>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Beatae accusamus tenetur numquam!</p>
<p>Eos, rerum? Autem labore molestiae nesciunt vel eum. Minus dignissimos dolor quasi?</p>
<p>Incidunt voluptatem suscipit dolorum dicta eligendi totam animi aperiam quaerat voluptas alias.</p>
</div>
</div>
</div>
</section>
body {font-family: 'Poppins', sans-serif;overflow-x: hidden}
/* imortant image reset */
img {max-width: 100%}
figure img {max-width: 50vw;}
figure {
display: flex;
justify-content: flex-end;
}
This Pen doesn't use any external JavaScript resources.