title: Unable to set absolute position for my div's using jQuery
body: <p>@Purmou</p>
  
  <p>Hi, Please consider the following html5 file. The div's are still positioning at 0,0 and the borders are also not appearing. I have tried various changes to the enclosed but it does not seem to work.</p>
  
  <p>Will really appreciate your help Purmou and all others reading this note. Regards, sbguy</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en-US"&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;Absolute Positioning Test&lt;/title&gt;
  &lt;style type="text/css"&gt;
  html, body {
      position:absolute; 
      top:0;
      left:0;
      margin:0px;
      padding:0px 0px 0px 0px;
      height:100%;
      width:100%;
  }
  div {
      margin:0px;
      padding:0px 0px 0px 0px;
  }
  &lt;/style&gt;
  &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script type="text/JavaScript"&gt;
  var A_height = 100;
  var A_width = 100;
  var A_top = 20;
  var A_left = 20;
  var B_height = 100;
  var B_width = 100;
  var B_top = 200;
  var B_left = 200;
  jQuery("#A").css({ 
      "position": "absolute",
      "width": A_width + "px",
      "height": A_height + "px",
      "top": A_top + "px",
      "left": A_left + "px",
      "border": "1px solid black",
      });
  jQuery("#B").css({
      "position": "absolute",
      "width": B_width + "px",
      "height": B_height + "px",
      "top": B_top + "px",
      "left": B_left + "px",
      "border": "1px solid black",
      });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="A"&gt;
  &lt;p&gt;HELLO A&lt;/p&gt;
  &lt;/div&gt;
  &lt;div id="B"&gt;
  &lt;p&gt;HELLO B&lt;/p&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>