屏幕短路时，页面的上半部分会消失

Question

参考this Bootstrap模板。

当屏幕高度较短时，顶部会消失。 See this image for demo.它从无法看到的意义上消失，即使滚动到顶部也没有帮助。有人可以解释为什么会发生这种情况以及如何改变这种行为，以便即使屏幕很短也可以访问整个页面？

Answer 1

将max-height:100%;添加到.form-signin

.form-signin {
width: 100%;
max-width: 330px;
padding: 15px;
margin: 0 auto;
max-height: 100%;
}

Answer 2

这是由Flexbox居中问题引起的explained here。

解决方案是在表单上使用my-auto（自动垂直边距）。

<form class="form-signin my-auto">
    ...
</form>

demo