I'll start by saying don't use absolute positioning for the structural layout elements. It's just going to cause issues that are going to give you a headache. Absolute positioning isn't the devil (despite what some might lead you to believe) but it seems to get over used by people who don't have a firm grasp on it.
Any way, looking at your code you might try starting with something like this:
You don't need to to use absolute positioning with your layout from what I see. One thing to consider is that elements 'stack' from top down. If you absolutely position them, they are ignored by other elements. Another thing is that if they are absolutely positioned, you need to set a width, but at a default your divs are going to be 100% width. When you Ab Pos them, they loose this and you have to keep unnecessarily having to redefine the widths.
padding: 0; /* remove the default padding */
margin: 0; /* remove the default margin */
font-size: 62.5%; /* set to roughly 10px asssuming most browsers are set to 16px */
text-align: center; /* needed for IE6 to center the whole shebang */
font: normal 1em/1.2em arial, helvetica, sans-serif; /* your new base fpnt size (roughly 10 px) */
margin: 0 auto; /* centers the whole box in the screen regardlesss of screen size */
position: relative; /* this is now the parent of any direct child that 'must' be absolutely positioned */
As far as using percentages, well, for layout, don't. Percentages in distance are going to be based on the width of the browser. I for one don't browse full screen. So any page based on percentages is not going to display correctly. I mean don't use positioning in percentages when it's going to be based off of an element (the browser) when you have no control over the element.