此问题已在此处有答案：

CSS: Width in percentage and Borders（5个答案）
How to make an element width: 100% minus padding?（15个答案）
4天前关闭。
截至4天前，社区正在审查是否重新开放此问题。
我创建了一个尽可能简单的例子。

#container {
  height: 60%;
  width: 50%;
  border-style: double;
}

#inset {
  padding: 2%;
  border-style: groove;
  height: 100%;
  width: 100%;
}

<div id="container">
  Parent
  <div id="inset">
    Child
  </div>
</div>

我想知道为什么child div不简单地填充其parent div的剩余空间，高度和宽度设置为100%（即使没有文本，子div也会溢出）。
我看到很多人问同样的问题，但他们得到的是解决方案，而不是解释。我正在努力掌握CSS，这是我认为我落后的地方。
我希望它看起来像