使子元素（带填充）的父元素的宽度和高度为100％ [英] Make child element (with padding) 100% width and height of parent

问题描述

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

Is it possible to make a child element (with padding) 100% width and height of its parent element?

html：

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

css：

  #child {
    padding: 15px
    }

I

我还尝试过使孩子的位置宽/高，但这会使孩子比父母大。

I have also tried to make the child position absolute and set top,bottom,left and right to 0 and this works for the width but not the height.

父级可以是可变大小。

此外还需要在IE8上工作。

In addition needs to work on IE8.

推荐答案

您需要使用 box-sizing：border-box; 属性：

You need to use the box-sizing: border-box; property:

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

这篇关于使子元素（带填充）的父元素的宽度和高度为100％的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！