Why isn't the box width fixed to 20px with `box-sizing: border-box`? What calculation is the browser doing?

Viewed 29

In the following generated box by element why is the computed value of the width property not 20px? Why is it being changed to 32px?

div {
  height: 16px;
  width: 20px;
  padding: 16px;
  box-sizing: border-box;
  background-color: blue;
  color: white;
}
<div>a</div>

rendered box computed value in chrome tab

0 Answers
Related