title: Top and bottom don't work when positioning relative using %
body: <p>i'd like to know this: why top and bottom properties don't work when i move an element using % in a relative positioning? Consider this example:</p>
  
  <pre><code>div {
    width: 100%;
    background-color: black;
  }
  
  p {
    position: relative;
    top: 10%;
    color: red;
  }
  </code></pre>
  
  <p>If i use em instead of %, text will go down, why not the same thing with %?</p>
  
  <p>One last thing: does the use of em instead of % when positioning elements (not for sizing them) in a fluid layout create troubles?</p>