如何在全屏上拉伸flexbox？

Question

如何让我的弹性盒在全屏上拉伸？这是我的网站，我想从中删除可用空间>>

请帮助我并告诉我如何使我的网站全屏显示？我尝试将边距和填充设为零，但不起作用：/

这是我的网站，请帮助我，这非常重要。!重要:) lumin.ge/html/wwwabc

Answer 1

编辑 -

您想要拉伸的 div 甚至还没有弯曲，这是一个可能的解决方案。注意：您将不得不使用较小的尺寸来使用它，但这应该很容易。

将以下内容添加到您的 CSS 中。

.site-info {
  background: #F57828;
  text-align: center;
  height: 25vh;
}
#section2 .header {
  background: #000;
  height: 50vh;
}

请发布一些代码来帮助我们帮助您。不过这篇文章应该可以帮助您入门。

帖子中的示例代码 -

.site-info {
  background: #F57828;
  text-align: center;
  height: 25vh;
}
#section2 .header {
  background: #000;
  height: 50vh;
}

.fill-height-or-more {
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.fill-height-or-more > div {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.some-area > div {
  padding: 1rem;
}
.some-area > div:nth-child(1) {
  background: #88cc66;
}
.some-area > div:nth-child(2) {
  background: #79b5d2;
}
.some-area > div:nth-child(3) {
  background: #8cbfd9;
}
.some-area > div:nth-child(4) {
  background: #9fcadf;
}
.some-area > div:nth-child(5) {
  background: #b3d4e6;
}
.some-area > div h1, .some-area > div h2 {
  margin: 0 0 0.2rem 0;
}
.some-area > div p {
  margin: 0;
}

html, body {
  height: 100%;
}