我想堆叠一个 Sticky Header + Router Outlet + Footer。我的问题是页脚不显示,路由器 socket 溢出或不显示。
我试过用
<div class="container" style="position=relative">
<header style="position:absolute"></header>
<router-outlet style="position:absolute></router-outlet>
<footer style="position:absolute></footer>
</div>
全部(最小高度:适合内容
,最大高度:100vh
,最小宽度:100vw
)。
我还会在嵌套组件(router-outlet)中放一个容器到min-height: 100vh
这是我得到的输出(使用下面提供的建议:flex: auto; 显示: flex ; flex 方向:列;)。请注意,尽管 Position:absolute 和 bottom 0,页脚并没有粘在底部。
编辑: 这不是页脚/容器问题。我使用的这个提议的方法在理论上是有效的。为相应的路由组件设置正确的 CSS 样式会影响路由器导出。
最佳答案
你可以试试 flex 布局。
flex: auto;
display: flex;
flex-direction: column;
可以设置页眉和页脚的高度。
关于css - 设置 Sticky Header + Footer + Router Outlet : Angular 2 + 高度的最佳方式是什么,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55769330/