Im trying to get a div so that it is always 15px in from the left of the page, but for it to take up the rest of the remaining page no matter what the useres resolution is.

So far I have this code:

#portalWrapper {
    position:absolute;
    width:100%;
    padding-left:15px;
    background-color:#FFF;
    height:200px;
    z-index:1; }

#test {
    background:#000; }

<div id="portalWrapper">
<div id="test">aasdfsadf</div>
</div>

This makes div#test shift to the left by 15px, however it's width remains the full width of the browser and therefore a horizontal scroll bar is inserted into the page.

Instead of shifting div#test to the side, I sort of want to 'squeeze' it by 15px, am I on the right track to getting it right or do I need a completely different method?

You're on the right track, but you have a lot of unnecessary CSS in there that's causing you problems.

First off, here is some code you should be using instead:

#portalWrapper {
    padding-left:15px;
    background-color:#FFF;
    height:200px;
}

#test {
    background:#000; 
}

What I did was take out the positioning, the width, and the z-index. Unless you have a specific reason to have the positioning or the z-index in there, they're just cluttering up your code. The positioning also oftentimes clutters up your layout. I got rid of the width because the width for divs on browsers is automatically the width of the browser window. So that's not needed either. Try out that code, it outta work. If not, tell me.

- Steve

Ahh thanks that seems to work. I had a lot of other code in there because I was originally messing around getting everything positioned absolutely, but I don't think I need to bother with any of that anymore!