title: How to add image on right side while text is on the left. using div
body: <p>basically i gave a div code which i got from bootsrap and i am tring to add the image within the div but it doesnt seem to fit in as well no matter how many times i change the image size by height and width.</p>
  <p>as you see in the screenshot below the image falls off the border of the div. i want it contained neatly.  so text will be on the left and the image is on the left.</p>
  <p>i have tried many time but failed. please someone help me i am uni student and trying to figure out all this alone but its taking alot of my time trying to fix it and its due in 6 days!!</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet" /&gt;
  &lt;div class="container my-5"&gt;
    &lt;div class="row p-4 pb-0 pe-lg-0 pt-lg-5 align-items-center rounded-3 border shadow-lg"&gt;
      &lt;div class="col-lg-7 p-3 p-lg-5 pt-lg-3"&gt;
        &lt;h1 class="display-4 fw-bold lh-1"&gt;Welcome to the Neurodiverse Page!&lt;/h1&gt;
        &lt;p class="fs-5 mb-4"&gt;Here you will find many information to help be successful in a career in Ai or if your like many of just like learning more about Ai well this place is for you!&lt;/p&gt;
        &lt;p class="fs-5 mb-4"&gt;This website has been designed to have less clicks! meaning you can scroll through the information you need!&lt;/p&gt;
        &lt;p class="fs-5 mb-4"&gt;Dont forget to sign up which is at the bottom of this page!&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="col-lg-4 offset-lg-1 p-0 position-relative overflow-hidden shadow-lg"&gt;
      &lt;img class="d-block rounded-lg-3" src="bootstrap-docs.png" alt=""&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="my_box"&gt;
    &lt;div&gt;
      &lt;img src="https://miro.medium.com/max/1750/1*uQdZlvHn4rb4boX0_VBIVw.jpeg" width="895px" class="img-fluid.img-fluid. max-width: 100%; and height: auto;   alt=" "&gt;&lt;/div&gt;
  &lt;/div&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p><a href="https://i.stack.imgur.com/6M0IP.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/6M0IP.png" alt="Help needed" /></a></p>