title: putting a inset box shadow on an image or image within a div
body: <p>I have an image on my page which i want to put an inset box shadow on. 
  I have tried doing this with the image both in, and out, of a div.
  Can anyone help me to get an inset box shadow to display?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;body&gt;
  
  &lt;div id="logo"&gt;
  &lt;img src="images/key.jpg"  width="3%" height="3%"/&gt;
  &lt;/div&gt;
  
  &lt;a href="scene2.html" class="next"&gt;Next&lt;/a&gt;
  &lt;a href="abduction.html" class="back"&gt;Back&lt;/a&gt;
  
  &lt;img src="images/scene1.jpg"  width="650" height="650" class="backing"/&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.backing {
      position:relative;
      z-index:-10;
      float:left;
      margin-left:12%;
      box-shadow: 0 0 -50px -50px  #FFF;
          -moz-box-shadow:  0 0 -50px -50px  #FFF;
          -webkit-box-shadow:  0 0 -50px -50px  #FFF;
  
  }
  
  .next {
      position:relative;  
      margin-left:8%;
      z-index:200;
  }
  
  .back {
      position:relative;
      margin-left:2%;
      z-index:220;
  
  }
  </code></pre>