react css root div 全浏览器高度

Question

我似乎无法让反应根 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为100%or 100vhof#root而不是来实现这一点#root > [data-reactroot]。这确实取决于您的应用程序的呈现结构。您可能还需要height根据嵌套事物的方式在多个元素上设置 ：

#root {
  height: 100vh;
}

这是一个StackBlitz，显示了正在运行的功能。您可能需要叉它，更新它与您的应用程序的结构匹配更多，但它可能是唯一的问题是您靶向的孩子#root，而不是只#root。

希望这有帮助！