Element.offset / Element.documentOffset resulten in false values

Question

Sorry for the indescriptive title, I couldn't come up with anything better.

I've tried getting the position of an Element in the DOM, relative to the document.

I've tried doing it as following:

Element element = document.querySelector('.element');
int top = element.documentOffset.y;
int left = element.documentOffset.x;
someAbsoluteFloatingElement.style.top = top.toString() + "px";
someAbsoluteFloatingElement.style.left = left.toString() + "px";

'someAbsoluteFloatingElement' is a direct child of the body element. It also has 'position: absolute;' in its CSS properties.

'someAbsoluteFloatingElement' aligns perfectly with the top to 'element', the left value however, is incorrect. I don't know why, I don't know how, I really am lost in this one.

'element' is a child of a custom polymer element. Does this have any influence on the offset of the Element?

What is the expected behavior? How should the result be different? — Günter Zöchbauer, Sep 05 '16 at 17:19
I've almost reproduced it: https://dartpad.dartlang.org/7ab3c21dd6debaa98f7d5d003c68e25e The blue box should almost cover the 'T' — Albêr, Sep 05 '16 at 17:22
I think it's a bug. I'd try http://stackoverflow.com/a/26230989/217408 instead. Can you please report the bug in the Dart SDK? — Günter Zöchbauer, Sep 05 '16 at 17:33
I think I solved it :| . Instead of centering the object with `margin: auto;`, I centered it with `left: 50%; transform: translate(-50%, 0%);`. It seems that the translate() new coordinates are not taken into account. — Albêr, Sep 05 '16 at 18:10

Element.offset / Element.documentOffset resulten in false values

0 Answers0