title: Use inline styles to postion vertically centered image to left of block paragraph?
body: <p>I'm trying to position a vertically-centered image to the left of a block of text. Image is 100x100 and text exceeds this height. I do not want text to wrap underneath of image, but to stay in one block on the right side. Need to accomplish all of this with inline styles as I am working in a CMS. I also need a small margin between the right side of the image and the left side of the text block.</p>
  
  <p>The closest I've been able to come is the following code, but the text is going behind the image here, and I don't think that the image is truly centered vertically.</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;div style="position: relative;"&gt;&lt;img style="margin: 0; position:  absolute; top: 10%;" src="http://placehold.it/100x100" alt="" /&gt;
      &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam auctor velit nec fringilla imperdiet. Sed at ornare urna. Nullam libero ante, vulputate sit amet semper vitae, efficitur ac velit. Donec egestas nibh eu tortor imperdiet, eget feugiat ligula porttitor. Ut orci nulla, sollicitudin sit amet elit pretium, consequat ultricies tellus. Proin nec magna id elit   egestas malesuada a non tortor. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque nunc risus, facilisis eget viverra quis, imperdiet ut nisl. &lt;/p&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>