939840 - Box model pane: show the positioning information in addition to margin/padding/border/etc

Status: RESOLVED FIXED

(DevTools :: Inspector, defect)

Description

[Julien Wajsberg [:julienw]]

In Firebug's box model pane, we can see all positioning information for an element, if it's relatively or absolutely or fixed positioned (and "position: sticky" could be nice to know now too).

We can also see the z-index although that's less useful to me.

In my day to day debugging, I really miss that ability in the native Dev Tools.

Comment 1

[Paul Rouget [:paul]]

Attachment: v1

Comment 2

[Paul Rouget [:paul]]

Getting some interesting errors:

console.error: element changed

Comment 3

[Paul Rouget [:paul]]

Comment on attachment 8333935 [details] [diff] [review]
v1

I broke something…

Comment 4

[Paul Rouget [:paul]]

Attachment: v1.1

Comment 5

[Paul Rouget [:paul]]

Comment on attachment 8333942 [details] [diff] [review]
v1.1

https://tbpl.mozilla.org/?tree=Try&rev=fcc9fbfc4518

Comment 6

[Mike Ratcliffe [:miker] [:mratcliffe] [:mikeratcliffe]]

Comment on attachment 8333942 [details] [diff] [review]
v1.1

Review of attachment 8333942 [details] [diff] [review]:
-----------------------------------------------------------------

r+ assuming that try is green

Comment 7

[Julien Wajsberg [:julienw]]

Maybe I was not clear enough in comment 0, but I'd like to see also the top/left/right/bottom properties when the element is positioned.

Comment 8

[Paul Rouget [:paul]]

(In reply to Julien Wajsberg [:julienw] from comment #7)
> Maybe I was not clear enough in comment 0, but I'd like to see also the
> top/left/right/bottom properties when the element is positioned.

Alright. This is the first part (showing position), for top/left/right/bottom properties, it will happen in bug 940275.

Comment 9

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/integration/fx-team/rev/cd3cacf4d443

Comment 10

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/mozilla-central/rev/cd3cacf4d443