Javascript 正文未使用reactjs/react引导覆盖整个页面

我的问题是，正如标题所说，我有一个渐变背景，但它并没有覆盖整个页面，你可以在这里看到，你会注意到，在我的导航栏下面，有一个稍微不同的颜色，我也想修复

这是我的css代码

.App{
文本对齐：居中；
颜色：黑色；
背景：#bdc3c7；/*旧浏览器的回退*/
背景：-webkit线性渐变（至底部，#2c3e50，#bdc3c7）；/*Chrome 10-25，Safari 5.1-6*/
背景：线性渐变（至底部，#2c3e50，#bdc3c7）；/*W3C，IE 10+/Edge，Firefox 16+，Chrome 26+，Opera 12+，Safari 7+*/
}
.旋转木马{
左边距：10%；
保证金权利：10%；
}
.navbar品牌{
显示器：flex；
对齐项目：居中；
}
.navbar品牌>img{
填充：7px 14px；
}
.LogoHeader{
颜色：白色；
}
.页脚{
背景色：黑色；
位置：相对位置；
宽度：100%；
高度：80px；
颜色：白色；
边框颜色：黑色；
页边距底部：自动；
文本对齐：居中；
左：0；
底部：0；
}
.关于{
显示：块；
左边距：自动；
右边距：自动；
}
.文本区{
调整大小：垂直；
}

当您将

高度：100vh

添加到

.App

类中时，它可能会起作用。此导航栏是从框架导入的吗？

通常，主体将具有最小高度。您需要为问题的两个部分添加更多信息。特别是使用的HTML。如果我使用高度：100vh，即使我没有任何内容，它也会一直下降。我只是在帖子中添加了一个图像，这样你就可以看到。导航栏是从react boostrapSo导入的，你只是想让页脚粘到底？你喜欢什么？或者你想在不影响任何其他元素的情况下使渐变成为完整页面？