Hey there, I'm working on creating my first DIV layout but im having problems. Whenever I use "position:absolute;" in a div, window resizing and also screen resolution will stuff up the layout.

So I decidid to try "position:relative;" and this seemed to do the trick BUT when making the aboutme div for content etc. it would cause the page to stretch if the height was too large, evn though it was only about 300px and was nowhere near the bottom of the page.

Anyone able to help? thanks

Absolute positioning should work. Try positioning it this way:


Replace the number signs according to where you want your DIV to be. If that doesn't work, please post a link to your page along with the codes that you're using.

Or check out this cool tutorial for positioning

quick lesson on "position: relative"

top: -45px = moves up 45px
top: 45px = moves down 45px
left: -15px = moves left 15px
left: 15px = moves right 15px

quick lesson on "position: absolute"

top: 0% = moves to top of page
top: 50% = moves to middle of page
top: 100% = moves to bottem of page
left: 0% = moves to left of page
left: 50% = moves to center of page
left: 100% = moves to right of page
margin-left: -15px = moves left 15px
margin-left: 15px = moves right 15px
margin-top: 45px = moves down 45px
margin-top: -45px = moves up 45px

^ For almost every layout, you will want to use 50%.

^Right. That will make it centered and static for every resolution.