title: How can I wrap text around an object on three sides like this?
body: <p>Basically looking for a way to pull off CSS Shapes without using a polyfill.</p>
  
  <p>I've got a <code>&lt;div/&gt;</code> full of content. Just outside of this div I have a small <code>&lt;aside/&gt;</code> component I need to have floated to the left and with the content wrapping around it, above, to the right and below. (See image below.) This isn't a simple float because the floated element won’t be aware of the beginning or ending of the wrapping content.</p>
  
  <p>You'll see in the image below that the floated object appears to begin <em>inside</em> of the first paragraph. But the object must actually live outside of the content div in the DOM tree.</p>
  
  <p>I know there is a <a href="http://www.w3.org/TR/css-shapes/" rel="nofollow noreferrer">CSS Shapes spec in the works</a>, but don't believe it's supported anywhere yet.</p>
  
  <p>Is it yet possible to pull something like this off without a CSS Shapes polyfill?</p>
  
  <p><a href="https://i.stack.imgur.com/cQqAG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cQqAG.png" alt="enter image description here"></a></p>