以下每个组件都已经有过多次提问:
- 如何固定导航栏
- 如何固定页脚
- 如何将div居中于页面中央
我想要实现的是同时拥有以上所有功能
我想要在页面中央(水平和垂直方向)居中一个登录面板,但是我遇到了一些页脚问题
- 我希望页面在手机上正确显示。登录区域不应该位于页眉或页脚下方。
- 当页面被显示时,我希望页脚也能被显示。目前需要向下滚动才能看到页脚。登录表单与页脚之间的空间太大。页脚需要保持固定在底部。
- 如果可能的话,登录表单应该更宽、更高
谢谢你的帮助
这是我需要解决的关键部分
/* Wrapper for page content to push down footer */
#wrap {
min-height: 100%;
height: 100%;
/* Negative indent footer by its height */
margin: 140px 0 -200px 0;
/* Pad bottom by footer height */
padding: 0;
}
请查看此处的jfiddle,了解相关的it技术内容。
目前
___________________________________________________ _ Visible Page
|Navbar | |
| | |
|_________________________________________________| |
| | |
| | |
| | |
| ^ | |
| | Too much space | |
| | | |
| | |
| _______________ | |
| | | | |
| | Login Area | | |
| |_______________| | |
| | |
| | |
| | |
| | |
| ^ | _|
| | Too much space |
| | |
| |
| |
| |
| |
| |
|_________________________________________________|
| Footer |
|_________________________________________________|
What I want
___________________________________________________ _ Visible Page
|Navbar | |
| | |
|_________________________________________________| |
| | |
| | |
| | |
| | |
| _____________________ | |
| | | | |
| | | | |
| | Login Area | | |
| | | | |
| |_____________________| | |
| | |
| | |
| | |
| | |
|_________________________________________________| |
| Footer | |
|_________________________________________________| _|