边栏高度随内容长度而变化

Question

我在angular2应用程序中边栏的长度有问题。 我有一个导航组件，其中包括顶部导航html和侧边栏导航html。 应用加载后，边栏就可以了。 如果我路由到其他组件，则侧栏会根据该组件的长度而变短或变长。 我想固定边栏的高度。 请查看图片以了解我要说的内容。 主题模板是从此处获取的 。

图1-应用加载时

图2-当导航到其他组件时

图3-它变得更短

loggedIn.component.html

<div class="wrapper">
    <bmis-navigation></bmis-navigation>
    <router-outlet></router-outlet>
</div>

navigation.component.html
html在这里 css文件在下面链接。 1- Admin.css 2- red.css

Answer 1

没有CSS，因此很难诊断此问题。 话虽这么说，根据提供的代码，我想您的问题就在这里，而不是DOM本身。

您是否已在main-sidebar类上设置了min-height设置，或类似的解决方案？ 我建议根据您的需求，遵循以下原则：

.main-sidebar {
  min-height: ~"calc(100vh - @navigation-height)";
}

同样，就样式而言，上下文并不多，但是我希望这会有所帮助！

PS我很抱歉，如果我的LESS语法完全关闭，我相信您正在使用它，但是我没有实践。

Answer 2

我没有Angular或您使用的经验。

但是我认为为侧边栏设置最小高度可以解决此问题。