Float and clear:--
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Html float and clear</title>
</head>
<style>
.container{
border: 1px solid black;
}
img{
/* right ko flow hoga ye wala */
float: right;
}
.card{
border: 2px solid yellow;
/* clear se aap kahate hai ki mujhe wo override kar raha hai usko baju kardo */
clear: both;
}
</style>
<body>
<div class="container">
<img src="https://images.pexels.com/photos/60597/dahlia-red-blossom-bloom-60597.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2" alt="etsse" width="230px">
<div class="card">
<p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Nulla libero quas accusamus distinctio nobis officia consectetur aliquid aspernatur labore hic. Quidem in exercitationem ad est. Quaerat, tempore. Dolor repudiandae blanditiis quo mollitia consequuntur. Libero inventore unde, error exercitationem quibusdam pariatur modi ratione assumenda ut tenetur voluptatum sed illo, similique nam praesentium asperiores cupiditate nemo suscipit itaque deleniti! Mollitia, illo at! Asperiores ut porro veritatis. Delectus ex vel aut dicta facilis magnam eaque, maiores, quae quaerat maxime ullam autem quos atque. Deleniti recusandae quam explicabo exercitationem laudantium deserunt officiis doloribus, rerum nisi aliquid et consectetur cum ab numquam temporibus quibusdam iure ex esse obcaecati nostrum, enim mollitia voluptatibus placeat ipsa! Dolorum quo tempore a vitae ex maiores? Magni, vel illo? Dolorem.</p>
</div>
<div class="card">
<p>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Delectus perferendis libero commodi magni. Voluptates provident, commodi alias unde molestias illo est odit hic, numquam sed aliquid ea libero fuga harum mollitia voluptatibus atque aut facere quis. Voluptatum officia et, velit laboriosam exercitationem voluptate veritatis atque sit optio dignissimos saepe modi corporis dicta dolore, fuga vero nesciunt enim repellendus rem culpa? Illo quo ut magni possimus pariatur, in quidem eaque natus inventore, labore aspernatur. Ut distinctio in dolorum quis magni sed provident autem non voluptas atque suscipit, a illum error, ipsam porro odit assumenda similique et dicta nulla inventore doloremque? Saepe consectetur illo totam eum vel laborum nemo voluptas! Recusandae nulla, modi ipsa libero similique est obcaecati rerum harum quae atque!
</p>
</div>
<div class="card">
<p>test</p>
</div>
</div>
</body>
</html>
Thanks you for commenting your questions. I will see question and respond you.