反应css root div完整浏览器高度

Question

我似乎无法获得react root div来填充浏览器页面。

我尝试添加以下CSS，以及几乎所有的组合

html, body {
    margin: 0;
    height: 100%;
}
.fill-height {
    min-height: 100%;
    height:auto !important; /* cross-browser */
    height: 100%; /* cross-browser */
}

#root > [data-reactroot] { height: 100vh }

Answer 1

您应该能够通过将height的{​​{1}}设置为100%的{​​{1}}或100vh而不是#root来实现这一目标。这确实取决于应用程序的呈现结构。您可能还需要根据多个元素的嵌套方式在多个元素上设置#root > [data-reactroot]：

height

这是StackBlitz，显示了正在使用的功能。您可能需要对其进行分叉并对其进行更新，以使其更适合您的应用程序的结构，但这可能是唯一的问题，因为您定位的是#root { height: 100vh; } 的子对象，而不仅仅是#root。

希望有帮助！