title: wrapping two columns of text around an image/shape from both sides html css
body: <p>I'm trying to wrap the text round the image used from both side <strong>like this</strong>:
  <a href="https://i.stack.imgur.com/Befmu.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Befmu.png" alt="enter image description here"></a></p>
  
  <p>here is the html.</p>
  
  <pre><code>            &lt;div class="container"&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-lg-4"&gt;
                      &lt;p&gt;
                          There’s nothing like the feeling of driving a brand new luxury car or fully equipped SUV – especially if it’s free!  That’s right!  As part of B-Epic’s Compensation Plan, one of the awesome ways we reward our Brand Partners is with a car payment bonus of $500 per month.
                      &lt;/p&gt; 
                      &lt;p&gt;
                          With our one-of-a-kind Car Bonus program, you only need to focus on one simple thing: Get 4 Brand Partners on the $89.95 package and then just teach them to do the same thing. Get 4, teach 4... it doesn't get any easier than that.
                      &lt;/p&gt;
                      &lt;p&gt;
                          You earn the Car Bonus by purchasing a $89.95 pack or higher and sponsoring four Brand Partners at that same package level or higher who also sponsor four Brand Partners each at that package level or higher.  You are paid this bonus every month that you maintain the qualifications for it.
  
                      &lt;/p&gt;
          &lt;/div&gt;
                  &lt;img src="images\img3.jpg" class="element" alt="image"&gt;
                  &lt;div class="col-lg-4"&gt;
                      &lt;p&gt;What’s even better is that instead of requiring you to drive a specific make and model, you get to pick out any car (or truck, SUV, or even motorcycle) that you want…in the color of your choice!  Buy it or lease it – it’s completely up to you! 
                      &lt;/p&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Css for <strong>element</strong> class used in image tag</p>
  
  <pre><code>.element
     {
   shape-outside: circle(50%);
   width: 300px;
   height: 300px;
   float: left;
  
   }
  </code></pre>
  
  <p>Please share the code to have the effect like the one in the image above.</p>