jQuery absolute positioning & border issue
<p>I am enclosing a sample HTML5 file where I have defined 2 div's for absolute positioning alongwith a border. Both are not working. Can you please help ? I am stuck here for a long time and have tried multiple permutations, combinations of what I have seen on the web. Please note that I need to use the variables defined in this file to use with css etc.</p>

<p>Thanks in advance for your help. Will really appreciate if you can post the entire file after making changes to the enclosed file. 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;
    right:0;
    margin:0px;
    padding:0px 0px 0px 0px;
    height:100%;
    width:100%;
}
div {
    position:absolute;
    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 = 200;
var B_width = 200;
var B_top = 200;
var B_left = 200;
jQuery("#A").css({ "width": A_width, "height": A_height, "border":'1px solid black'});
jQuery("#B").css({ "width":B_width, "height":B_height, "border":'1px solid black'});
jQuery("#A").offset({top: A_top, left: A_left});
jQuery("#B").offset({top: B_top, left: B_left});
&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;BR&gt;&lt;/BR&gt;
&lt;p&gt;HELLO B&lt;/p&gt;
&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
