Forum Moderators: not2easy

Message Too Old, No Replies

Absolute positioning & screen resize

problem with absolute positioning

         

arbutus

4:31 pm on Jul 16, 2007 (gmt 0)

10+ Year Member



I have been reading about absolute positioning using css and wondering about what happens when the screen resolution is changed.
For instance, lets say that one had a 750 px table, centered, with a border and wanted to place an image so that it overlapped the left and top edge of the border. The image is set an absolute from the top and left side of the screen. If the end user was using a resolution of 800X600, the image would shift.

How can this be prevented?

thanks in advance

londrum

8:51 pm on Jul 17, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



position:absolute is supposed to take its position from its immediate container, rather than the actual screen.
so if you stick a div around the image and table, you can set it's position from the corners of that.

it's difficult to get things consistent across all browsers though. probably drive you up the wall trying! IE6 and below (i think) always measure the positions from the corner of the screen.

another way of doing it would be to do away with the topside and lefthand side borders completely, and make the image include them. (reproduce the border within the image.) if you make the image a background image, and position it at the top-lefthand side of the table it should do what you want. then it wont matter if the table moves when they change the size of the screen, because the image will be attached to it.