psd to html/css test problem

vdftr

i make my own psd design to train on,
i always get problem in the differents in resolution [ 1280 x 1024 and higher]
my screen is 1280 x 1024 when i use position relative it not work in higher resolution
the same is padding margin ,

i really dont know how to make the background is really hard;
my background is this:

#header{
background-color: #d02c2c;
height: 167px;
width: 1280px;
}

#main{
background-color: #f18484;
height: 472px;
width: 100%;
}

#content{
background-color: #f2ea62;
height: 274px;
width: 1280px;
}

#footer{
background-color: #1be6d6;
height: 110px;
width: 1280px;
}

how i make this backgrounds to all resolutions?

jedaisoul

The width is easy: use "width:100%".

The height is more difficult because it is split into bands. The easiest answer is, again, to use percentages. However, that is often not optimal. A better answer is to use "position: absolute", but that is more complex.

milotaix

Like jedaisoul sad, use position: relative; in the main tag with width:100% and the inside tags use position: absolute; . The position is set of the elementes top: , left, right or bottom relative with the parents tag tag you set the position relative, like this: