css - 使 Div 100% 成为祖 parent 容器？

Question

这是我遇到的问题:-

我有一个设置为最大宽度为 960 像素的 div。

div里面div的宽度设置为100%，但是100%表示最大为960px

如何在不将子 div(100%) 移出父 div(960px) 的情况下，让 960px div 内的 div 成为用户屏幕的 100%？

编辑以进一步澄清。 这是结构:-

 gParentDiv
    parentDiv
       myDiv

我希望 myDiv 与 gParentDiv 的宽度相同，但将其保持在 parentDiv 内

希望能帮到你

Answer 1

您可以使用视口(viewport)的高度和宽度。

例如，下面的类将使元素成为视口(viewport)的大小。

.fullscreen {
    width: 100vw;
    height: 100vh;
}

jsFiddle Demo

这是一个纯 CSS3 解决方案，但它有一些 browser support问题。

---

如果您只想在整个屏幕上拉伸(stretch)一个元素，您可以使用不同的方法。

jsFiddle Demo

.fullscreen {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}