Fir*_*rze 12 html css android mobile-browser twitter-bootstrap
我的页脚有问题.我希望页脚停留在屏幕的底部,但是有一个小问题.使用移动浏览器时,打开键盘时某些字段会被页脚阻止.页脚从键盘上升并阻挡您正在键入的字段.如何将页脚保持在底部并防止其从键盘上升?我希望它隐藏在键盘下面.
我正在使用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;
Run Code Online (Sandbox Code Playgroud)
}
<html>
<body>
<div class="container">
</div>
<footer class="bs-footer" role="contentinfo">
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
正如你在这里看到的那样.当我激活"Salasana"字段时,页脚会上升并阻止文本字段.


用avinash帮助解决了这个问题.我最终在我的CSS中更改了以下内容.由于我拥有容器div内的所有内容,因此我将容器高度设为100% - 页脚.我也删除了底部:从页脚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 */
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
26575 次 |
| 最近记录: |