This is a piece of my code I would like to know how to put an image and paragraph side by side.
<section class="contact-section" id="contact">
<div class="container">
<h1>All About Us</h1>
<hr>
<img src="hpbanner.webp" width="600" height="750">
<p>text here</p>
</div>
>Solution :
You can wrap img and p in a div, and make it a flexbox.
.flex-class {
display: flex;
flex-direction: row; /* this is optional because row is default*/
align-items: center; /* this is if you want to align items vertically in the center */
}<section class="contact-section" id="contact">
<div class="container">
<h1>All About Us</h1>
<hr>
<div class="flex-class">
<img src="hpbanner.webp" width="600" height="750">
<p>text here</p>
</div>
</div>
</section>