我有一个简单的页面，用户可以在其中进行搜索，结果填充页面。在进行搜索之前，有一个简单的表单，一些空白区域和带有社交媒体链接的页脚。
如果我在页脚上使用固定位置，我会在搜索之前获得所需的效果，但之后，页脚会位于最终结果的顶部。
我可以使用继承位置修复此问题，但在搜索之前页脚不会位于页面底部。
我尝试过使用fixe dposition并在底部添加底部填充等于页脚的高度，但在这种情况下这并没有做任何事情。
有什么想法吗？
以下是heroku上当前版本的链接，您可以在其中查看问题。它使用页脚上的固定位置。这也是fyi的React项目。
答案 0 :(得分：0)
您可以使用flexbox轻松完成此操作。您希望将您的反应根div设置为至少视口的高度，然后将结果元素设置为flex-grow: 1，以便它消耗所有剩余空间，并将页脚推到底部窗口。
添加此CSS
[data-reactroot] {
display: flex;
flex-direction: column;
min-height: 100vh;
}
.DisplayRecs {
flex-grow: 1;
}
从width
position，bottom和.Footer