title: How Can I move this Flex-Box Item to be next of the img?
body: <p><a href="https://i.stack.imgur.com/eSy3w.png" rel="nofollow noreferrer">Plz see image</a></p>
  
  <p>How Can I move this Flex-Box Item to be next of the img ?</p>
  
  <p><a href="https://i.stack.imgur.com/eSy3w.png" rel="nofollow noreferrer">https://i.stack.imgur.com/eSy3w.png</a></p>
  
  <pre><code> &lt;div class="brif fb"&gt;
                  &lt;div class="sml-con"&gt;&lt;img class="sml-thumb" src="images/chosen/edward.jpg" alt=""&gt;&lt;/div&gt;
                  &lt;h3&gt;The WhiteBeard Pirates&lt;/h3&gt;
                  &lt;div class="trai"&gt; &lt;i class="fa fa-video-camera mr5"&gt;&lt;/i&gt; &lt;span&gt;Trailer&lt;/span&gt;&lt;/div&gt;
                  &lt;p&gt;Meet the most unusual baby, known only as "Baby", who wears a suit, speaks with the voice and wit of Alec Baldwin, as he teams up with is seven-year old brother to stop the dastardly plot of the CEO of Puppy Co.&lt;/p&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>   `.brif { width:69%; flex-wrap: wrap; padding:17px; align-items: flex-
  start; /* prevent the childs from taking full height */  }
  
  .brif .sml-con { width: 140px; height: 210px;  }
  
  .brif .sml-thumb { width:100%; height:100%; }
  
  .brif h3 { padding: 9px 15px; }
  
  .brif .trai { background:  #0397D6; padding: 5px 9px; border-radius:10px; 
  margin:5px 0; }
  
  .brif .trai i{ margin-right:1px; }`
  </code></pre>