我正在构建一个经常使用嵌套 View 的 Angular 应用程序。然而，某些 View 比页面上的其他元素高，并且最终延伸到父 View 的末尾之外。
我正在使用 Ryan Fait's Sticky Footer所以我有一个包含 div 的包装器设置为 height:100% 我希望页面只是适应并将页脚移动到嵌套 View 的底部但是我看到了样式页脚 border 和 background-color 的元素保留在父 div 的末尾，而页脚的内容被推到嵌套 div 的末尾。
包括一张图片，因为我正在努力使语言准确无误:
我真的在寻找任何解决方案，从修复 css 到看起来更 hackier 的东西，比如更改页脚或在某些页面上使用 ng-if/ng-class。我想我误解了一些关于 CSS/UI-Router 的东西，但我无法真正追踪它。
代码不是很有趣，但就是这样吗？
代码
.wrapper {
min-height: 100%;
margin-bottom: -50px;
}
.push {
height: 50px;
}
.footer {
display: block;
height: 50px;
}
.nested {
max-height: 500px;
}<body>
<div class="wrapper">
<div>
<h1>Some text</h1>
<ui-view class="nested"></ui-view>
</div>
<div class="push"></div>
</div>
<footer class="footer">
<span>some copy</span>
</footer>
</body>最佳答案
如果您对高度使用百分比值(即相对高度)，则父元素高度也必须定义。在您的情况下，您还需要 height: 100% 正文和 html，例如
html, body {
height: 100%;
}
关于css - UI-路由器 : Height:100% on body element ignoring nested view height，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39863209/