title: Show footer fixed at bottom right, Deafult is left (CSS/HTML5)
body: <p>I am Trying to Place My Footer in the bottom Right of the page. I am using the HTML5's <code>&lt;footer&gt;</code> tags.</p>
  
  <p>So, here is what i have in my CSS:</p>
  
  <pre><code>footer {
      position:absolute;
      bottom: 0px;
      float: right;
      height: 35px;
      margin: 0px 50px 0px 0px;
      background: #9FF;
      color: #000;
      text-align: right;
      padding: 10px 30px;
  }
  </code></pre>
  
  <p>With this code the footer perfectly sticks to the bottom. What i want is that it should also  be in the rightmost part of the footer as well.</p>
  
  <p><a href="http://i47.tinypic.com/2rrox0w.png" rel="nofollow">http://i47.tinypic.com/2rrox0w.png</a></p>
  
  <p>So, when i use the following code: <code>right: 50px</code> in the CSS. Then the footer gets positioned relative to the browser. So, whenever i Resize my browser the footer is dislocated.</p>
  
  <p><strong>What i Want ?</strong></p>
  
  <p>I want to footer to be placed at the bottom. And at a a margin of 50px(right) from the <strong>container</strong>(#main or #maincontent) it is placed in rather than the browser. The <code>float: right</code> does not seem to work.</p>
  
  <p>I have looked the whole internet and stackoverflow as well. But, could not find a solution to this kind of issue.</p>
  
  <p>I am using Google Chrome 22. So, My Browser is largely HTML5 compatible.</p>