Css 100%宽度和宽度；高度背景图像不工作

我希望背景图像覆盖整个可用空间，而不会被挤压。
事实上，我以为这就是背景尺寸的作用，但我想我做错了什么，因为它不起作用，请帮帮我

HTML

<div class="myDiv">
    <p class="paragraph">Lorem Ipsum</div>
</div>

小提琴

---

只需将body和html设置为100%高度，div也一样

body, html{
    height:100%;
    padding:0;
    margin:0;
}
.myDiv {
    color: white;
    background: url('http://upload.wikimedia.org/wikipedia/commons/4/47/PNG_transparency_demonstration_1.png') no-repeat center center fixed; 
    height:100%;
    padding: 20px;
    box-sizing: border-box;
}

参见小提琴：

---

更新：为myDiv提供了一些填充，用于确保它不会超过100%。

问题是背景在div上，而div不够大。如果必须了解div的背景，请尝试以下操作：

.myDiv, body, html {
    width:100%;
    height:100%;
    padding:0;
    margin:0;
}

---

jsiddle:

要在所有浏览器中实现100%的div高度，您需要同时将：

html

和

body

设置为100%高度，但也要将以下样式应用于假定具有所有可用高度的div：

min-height: 100%;
height: auto !important;
height: 100%;

试试这个：

.myDiv:before {
                position: absolute;
                background: url(../images/ig.png);
                background-size: cover;
                width: 100%;
                height: 100%;
              }

.myDiv:before {
                position: absolute;
                background: url(../images/ig.png);
                background-size: cover;
                width: 100%;
                height: 100%;
              }