957148 - The layout view reports wrong dimensions if CSS transforms are used

Status: NEW

(DevTools :: Inspector, defect, P3)

Description

[Paul Rouget [:paul]]

div {
  width: 10px;
  height: 10px;
  transform: scale(2);
}

We report a size of 20px. It should be 10px.

Comment 1

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

So what do we display if a node is transformed in a way that the top, middle and bottom are all different sizes?

Comment 2

[Paul Rouget [:paul]]

(In reply to Michael Ratcliffe [:miker] [:mratcliffe] from comment #1)
> So what do we display if a node is transformed in a way that the top, middle
> and bottom are all different sizes?

Not sure to understand. We're talking about the size of the content. In the comment 0 example, the content size is 10px (even though it's scaled up).

Comment 3

[Sebastian Zartner [:sebo]]

In other words, the numbers within the box model should reflect the computed values for width and height, not the content box' bounding box size.
The bounding box size for each box may be displayed additionally, though, on hover.

Sebastian

Comment 5

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

Yes, the layout view should show the CSS box model and the perceptual sizes of the elements could be displayed additionally.