title: Text left and image right
body: <p>I'm trying to make text left and image right in the div. I found many examples in Stackoverflow where image is left and text right, then i tried to switch them but can't make it work.
  I found <a href="https://stackoverflow.com/questions/19458993/left-align-text-and-right-align-image-in-css">that on stackoverflow</a> but doesn't make sense for me.</p>
  
  <p>I've tried this <a href="https://jsfiddle.net/judj5nw6/" rel="nofollow noreferrer"><strong>JSFIDDLE</strong></a> but you'll see that it wont works.</p>
  
  <pre><code>.main-topic {
      border: 2px solid green;
      width: 1541px;
      margin: 0 auto;
      clear: both;
  }
  
  .left-text{
      vertical-align:middle;
  }
  
  .right-picture{
      float: right;
  }
  
  .right-picture &gt; img{
      display: block;
  }
  
  .clear{
      clear: both;
  }
  </code></pre>
  
  <p>My goal is <a href="https://i.imgur.com/uU7qIMB.png" rel="nofollow noreferrer">this</a> (sorry can't post image i haven't enough reputation). I want that text be left side on the bordered div and picture in the right side</p>