Text left and image right
<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>