The method using Aside (third link posted by Excavator) looks quite promising to me, however it makes me worried if it won't conflict in some (mainly older) browsers... some testing will have to point this out.
Thus far i'm trying my best with this site to learn methods to try to keep a similar presentation across as many browsers as possible, thus far this has been the hardest for keeping things reasonable for an I.E. user, and the iPad also usually seems to fork some things up. Let's hope i can use this method in a cross-browser-friendly way
I really am trying my best to refrain from using tables, since so oftenly my head has been bashed in when i did use these, so first i'm trying these other solutions.
I'm affraid (unless i'm understanding the technique wrong) Faux Columns isn't going to help me much, i really need the left (navigation) div to look a little different, using faux columns i would probably need to make a pre-sized background image, which doesn't seem very flexible to me
as you can see i'm currently darkening that area using RGBa.
I'm thus far most annoyed by css2 that if you make a div absolutely positioned, it seems impossible to make it increase it's bounds to it's parents true size
when using relative positioning it is too prone to being sized in height wrongly unless using the marging-padding trick i already used.
Just to make sure for if all else fails (or works more miserably); Could you name a specific reason why it would wrong to use a table in this situation?
Now first going to tinker with the aside and section tags
 Seems to be working fine thus far on FF, Chrome and Android mobile browser, will have to wait untill im home to test on the iPad.
In any case, thanks for the tip to these two tags! seems to have solved my problem