[CSS] Absolute positioning help with resolutions

[~Matt~]

I have created a design which normally looks like this(at 1280x1024):

It is due to the absolute positioning that I am using.

It kinda stuffs up on a larger res(1920x1080):

Does anyone have any ideas on how i can fix this?

View the page here for css etc

BTW relative popsitioning turns out to look like this:

So it doesnt really fix anything

Edited June 16, 2009 by ~Matt~

[The_Decryptor Veteran]

One way to fix it while still allowing for absolute positioning is to set "position: relative;" on the parent element (position: absolute; is absolute against the browser viewport or a parent element that's relatively positioned)

#header {
	position:relative;
}

That "fixes" it, but the positions are wrong now, since before it was going off the side of the browser window, but now it's going off it's parent div, so you'd have to adjust those.

[~Matt~]

Relative positioning doesnt work. =\

I was wondering if there was something like dynamic css which could change depending on your resolution.

Edited June 16, 2009 by ~Matt~

[drhowarddrfine]

Add 'position:relative' to #header. You may have to do some readjusting, though.

EDIT: Well, that's what was already suggested, and it works for me so I don't know the problem. Which browser are you looking at?

[~Matt~]

Nvm I got it working now =] Thank you very much!