使子元素（带填充）为父元素的 100% 宽度和高度

是否可以使子元素（带填充）具有其父元素的 100% 宽度和高度？

html:

 <div id="parent">
       <div id="child"></child>
    </div>

css:

  #child {
    padding: 15px
    }

我尝试将子项设置为 100% 宽度/高度，但这会使子项由于填充而大于父项。

我还尝试使子位置绝对并将顶部、底部、左侧和右侧设置为 0，这适用于宽度但不适用于高度。

父级可以是可变大小的。

另外需要在IE8上运行。

您需要使用box-sizing: border-box;财产 https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing:

#child {
    padding: 15px
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}