我正在用Ionic v5创建一个简单的"注册"页面，我对CSS和样式都很陌生.我很难找到防止键盘向上移动内容的方法(参见图片)
My CSS:
.bottom-grid {
position: absolute;
left: 0;
right: 0;
width: 85%;
bottom: 10px;
}
.form-grid {
position: absolute;
left: 0;
right: 0;
width: 85%;
}
在这里搜索了几篇帖子后，我try 将position改为fixed，并添加:
ion-grid {
min-height: 100%;
}
运气不好.我怎样才能把这个底部网格保持在页面底部？谢谢你的帮助！
我的建议是使用ion footer.
<ion-header>
<ion-back-button>
Register
...
</ion-header>
<ion-content [fullscreen]=true class='myMaxHeightClass'>
...enter form inputs here
</ion-content>
<ion-footer>
<p>Already have an account?</p>
<ion-button>Login</ion-button>
</ion-footer>
在Css文件上(以防fullscreen=true不起作用):
.myMaxHeightClass {
height: calc(100vh-150px)
}
150px是页脚的高度.
这将使内容全屏显示，你的页脚将保持底部粘性.
避免使用绝对定位的页脚按钮，因为根据我的经验，这会导致一个大混乱.
如果这对你有效，请告诉我，如果不行，我会try 提出不同的方法