title: How to overlay a form field over an image with a fixed width?
body: <p>I have a fixed-width image.  Its width adjusts to 100% of screen width.  Its heights adjusts accordingly based on the screen width.</p>
  
  <p>I need to overlay a form field on top of this image.  I still want the full image to appear... all of its width and height as I have it now.</p>
  
  <p>How would I do this?  Also, how could I position the form field to be at a certain location on the image?  It's difficult because the image adjusts based on screen width.  But there's only a portion of the image where the form field fits to look good.  I hope this makes sense.</p>
  
  <p>Here is my current code:</p>
  
  <p>CSS:</p>
  
  <pre><code>.fixedimage img{
      width:100% !important;
      height:auto;
      display:block;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;TABLE WIDTH="100%" CELLPADDING="0" CELLSPACING="0" BORDER="0"&gt;
  &lt;TR&gt;
  &lt;TD WIDTH="100%"&gt;
  &lt;div class="fixedimage"&gt;
      &lt;center&gt;&lt;img src="fixedimage.jpg" /&gt;&lt;/center&gt;
  &lt;/div&gt;
  &lt;/TD&gt;
  &lt;/TR&gt;
  &lt;/TABLE&gt;
  </code></pre>
  
  <p>Thank you so much!!</p>