title: Image positioning over an included html file
body: <p>I am trying to pin an image to the top right corner over some included content. </p>
  
  <pre><code>&lt;div class="panel-body helpContent"&gt;
     &lt;img src="/images/myImage.png" class="beta" /&gt;
     &lt;jsp:include page='&lt;%="includes/" + thisFile +".html"%&gt;' flush="true" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The image is just a small little badge in the corner, about 150px x 150px. </p>
  
  <p>The beta class looks like this: </p>
  
  <pre><code>.beta{
     position:absolute;
     top:0px;
     right:15px;}
  </code></pre>
  
  <p>Problem is that the image sits on top of the content in some of the HTML files. Not all of them, mind you. But the ones with a really long header at the top. </p>
  
  <p>What I'd like is for the html content to wrap so it doesn't hit it. I could do that if I included the image in every single HTML file but I'd rather just include it once if possible. </p>
  
  <p>Is there a creative solution to this that doesn't require the image on every page? </p>
  
  <p>Thanks for any helpful tips. </p>