Position of an element in a web page

liangzou

Is there way to determine the position of an element in a web page accurately? If the position of an element is absolute, it may be easy. How can I deal with this problem when an element is relatively positioned and is inside another table or DIV?
Any ideas?

dwikristianto

yeah div layout sometimes make me nuts.
and when i got problems with it, googling is the only way.

welshsteve

If you are using Firefox, there is a great way of viewing exactly how each element is positioned on screen by using the CSSViewer extension. See below screenshot of it in action.

http://www.ldbsa.co.uk/images/cssviewer.png

When using the positioning attribute, you must understand the difference between relative and absolute positioning.

Relative positioning positions an element relative to it's position in the normal document flow i.e. either to it's parent or it's siblings. Whereas absolute positioning takes the element out of the normal document flow and positions the element based on the top left of the document window.

liangzou

CSS viewer is a great tool. Thank you very much for telling. Smile

welshsteve