Html 我需要修复Bootstrap h-100类它不工作_Html_Bootstrap 4

Html 我需要修复Bootstrap h-100类它不工作

html bootstrap-4

Html 我需要修复Bootstrap h-100类它不工作,html,bootstrap-4,Html,Bootstrap 4,我在管理面板中有一个侧边栏。我试着让这个边栏的高度达到100%，但我不能用这种方式解决我的问题首先，您不应该将.rows作为的直接子级放置。您需要将它们包装在.container或.container流体中。如果不这样做，您将在页面上体验到不同屏幕宽度的水平滚动条。请注意，您不应该将.container放在另一个.container中，但可以将.container放在.container流体中其次，为了使.h-100正常工作，您需要将它沿着子元素链传递给每个元素，因为它始终是其父元素的10

我在管理面板中有一个侧边栏。我试着让这个边栏的高度达到100%，但我不能用这种方式解决我的问题

首先，您不应该将.rows作为的直接子级放置。您需要将它们包装在.container或.container流体中。如果不这样做，您将在页面上体验到不同屏幕宽度的水平滚动条。请注意，您不应该将.container放在另一个.container中，但可以将.container放在.container流体中

其次，为了使.h-100正常工作，您需要将它沿着子元素链传递给每个元素，因为它始终是其父元素的100%。如果一个父元素没有，则链将断开，并且如果该元素具有一些流内容，则其子元素将具有100%的0或maxContent

以下是您使用.container的示例：

管理你应该提到：

h-25、h-50、h-75和h-100根据您父母的身高设置div的高度。你有两种方法：

设置父分区的高度

在你的css文件中使用height=100VH作为你的分区

<html class="h-100">
<head>
    <title>Admin</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body class="h-100">
    <div class="row h-100">
    <div class="col-md-2 h-100 bg-success" id="sidebar"></div>
    <div class="col-md-10 bg-danger" style="height: 500px;"></div>
    </div>
</body>
</html>