The Metrics side panel shows 4 bits of information. E.g. in this screenshot:
The perimeter of each of the four areas is called an “edge” so each box has four edges.
Reading from the inside out:
1. Content edge: 1400 (width) x 52 (height)
This surrounds the rectangle given by the width and height of the box. It’s the intrinsic size of the content and often depends on the rendered content.
Padding edge (optional): 0
This edge surrounds the box padding.
The border edge surrounds the box’s border. If the border has 0 width the border edge is the same as the padding edge.
Margin: 80 (top and bottom)
The margin edge surrounds the box margin.
Visual formatting model details:
Inline formatting mode and the rules laid out in CSS2: