CSS尽管80%div,如何使div 100%

时间:2016-11-23 14:58:27

标签: html css width

我想将div(divTwo)的宽度设置为另一个div(divOne)100%宽度,尽管divOne的宽度为80%。这可能吗?

JSFiddle:https://jsfiddle.net/u3mbjgp3/

HTML:

<div class="divOne">
    <div class="divTwo"></div>
</div>

CSS:

.divOne {
    width: 80%;
    height: 250px;
    background: #00ff00; /*green*/
}

.divTwo {
    width: 100%;
    height: 150px;
    background: #000; /*black*/
}

1 个答案:

答案 0 :(得分:5)

如果您希望divTwo占据窗口宽度的100%,可以使用100vw

&#13;
&#13;
body,
html {
  margin: 0;
  height: 0;
}
.divOne {
  width: 80%;
  height: 250px;
  background: #00ff00;
}
.divTwo {
  width: 100vw;
  height: 150px;
  background: #000;
}
&#13;
<div class="divOne">
  <div class="divTwo"></div>
</div>
&#13;
&#13;
&#13;