title: How stop elements from moving
body: <p>just a quick question. I have recently dicovered the use for percentages and positioning in css. However I'm having a little trouble with moving elements.</p>
  
  <p>I have two Images one on the left side of the screen and one on the right. both images are set to relevent positioning. The issue im having is getting the image on the right to stay put rather than moving to stay in frame of the window. How would I achieve this using percentages?</p>
  
  <p><strong>Css</strong></p>
  
  <pre><code>.left {
  position:relative;
  left:0%;
  z-index:250;
  }
  
  .right {
  position:relative;
  right:100%;
  z-index:250;
  }
  </code></pre>
  
  <p><strong>ADDED ON REQUEST</strong></p>
  
  <pre><code>/* -- page layout */
  #wrapper {
  position:relative;
  width:auto;
  height:auto;
  margin:0;
  padding:0;
  z-index: 0;
  }
  #wrapper #head{
  position:relative;
  width:100%;
  height:50px;
  z-index:200;
  margin:0;
  margin:0;
  }
  </code></pre>
  
  <p><strong>Note</strong></p>
  
  <p>These images are placed within a a div, that spans 100% of the screen. Thanks again!</p>