gpt4 book ai didi

android - 如何防止移动键盘在文本字段上升高页脚?

转载 作者:太空狗 更新时间:2023-10-29 13:11:09 25 4
gpt4 key购买 nike

我的页脚有问题。我希望页脚留在屏幕底部,但有一个小问题。使用移动浏览器时,打开键盘时某些字段会被页脚挡住。页脚高出键盘并挡住您正在输入的字段。如何将页脚保持在底部并防止它高出键盘?我希望它隐藏在键盘下方。

我正在使用 Bootstrap ,但我在自己的 CSS 中设置了以下内容:

footer {
width: 100%;
position:absolute;
left:0px;
bottom:0px;
height: 40px;
margin: auto;
overflow: hidden;
background:#2E2E2E;
text-align:center;
line-height: 15px;
color: #fff;

<html>
<body>
<div class="container">
</div>
<footer class="bs-footer" role="contentinfo">
</body>
</html>

如您所见。当我激活字段“Salasana”时,页脚会升高并挡住文本字段。

打开键盘前:

before

打开键盘后:

after

最佳答案

通过 avinash 帮助解决了问题。我最终在我的 CSS 中更改了以下内容。由于容器 div 中包含所有内容,因此我将容器高度设置为 100% - 页脚。我还从页脚中删除了 bottom:0px。

footer{
position: relative;
}
html,body {
height: 100%; /* Needed for container's min-height */
}

.container{
min-height:100%;
margin-bottom: -40px; /* Put negative height of the footer here */
padding-bottom: 40px; /* Put height of the footer here. Needed for higher than screen height pages */
}

关于android - 如何防止移动键盘在文本字段上升高页脚?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22627646/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com