JQuery: get the exact DIV position in pixels instead of returning “auto” as the result

Question

Let's say I have 5 div differ in height and width using float:left; :

When I use .css(""); to get your positions (left and right),

"auto" will always be the result.

Any method to get the exact number (left and right) in pixels relative to the container (< position:absolute; ) ?

(there are chances that the div will start a new line when I use float:left; and their width and height cannot be determined.)

Answer 1

jQuery has two methods for positions, one relative to the document and one relative to the container.

Regarding the container (position) .

Regarding the document (offset) .

Note that the position indicates relative to the offset parent, so you may need to apply the position: relative to the container element.