title: CSS item placement on page
body: <p>I'm learning to design web pages and of course I came across adaptive design too which I think is very clever. I do have one issue and it's placement of stuff on page. Not sure what is the correct approach. </p>
  
  <p>I have mobile version of <a href="http://www.experiment.donquidesigns.com/" rel="nofollow">this site</a> I'm playing with right now. </p>
  
  <p>CSS:</p>
  
  <pre><code>.MobContainer { 
  display: inline-block; 
  width: 100%; 
  height: auto; 
  margin-top: -10px; 
  margin-left: auto; 
  margin-right: auto; 
  } 
  
  .MobileTopBar { 
  z-index: -1; 
  left: -12px; 
  position: relative; 
  max-width: 900px; 
  } 
  
  .mobiletopNavigationAbout { 
  float: left; 
  height: 150px; 
  width: 30%; 
  margin-left: 3%; 
  position: absolute; 
  margin-top: -15%; 
  max-height:150px; 
  }
  </code></pre>
  
  <p>See if anyone can see what I'm not doing quite right from the code side......
  please be gentle I'm an old woman learning new tricks so see if it could be put in simple English as much as possible. </p>