title: Floating a canvas next to a paragraph
body: <p>I'm trying to achieve this placement, where the canvas is floating to the right of a paragraph:</p>
  <p><a href="https://i.stack.imgur.com/1OTLF.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1OTLF.jpg" alt="enter image description here" /></a></p>
  <p>I've been following similar settings that work for floating images, but I'm not having much luck with canvases.</p>
  <p>Here's what I've tried:</p>
  <p><strong>CSS</strong></p>
  <pre><code>.container
  {
      overflow: hidden;
      width: 100%;
  }
  .container p
  {
      display: block;
      width: 50%;
      margin: 0;
  }
  .container canvas
  {
      margin: 0;
      float: right;
      border:0.2vw solid blue;
  }
  </code></pre>
  <p><strong>HTML</strong></p>
  <pre><code>&lt;div class=&quot;container&quot;&gt;
      &lt;p&gt;Lorem ipsum dolor sit amet...&lt;/p&gt;
      &lt;canvas&gt;Your browser does not support the canvas element.&lt;/canvas&gt;
  &lt;/div&gt;
  </code></pre>