当网页缩短时,为什么我的固定元素不可见?

时间:2015-04-15 02:12:48

标签: html css

目标:
一个div是

{ position:fixed; bottom:0% }

它有一个真实的高度和宽度; z-index是文档中最高的 因此,它应该每次都可见!

问题:
移动浏览器在缩小时“剪切”页面的底端 但这也削减了我的div!放大或缩小时,我可以看到底边框如何使div显示/消失。

我的解释:
在我看来,页面的主体有一个overflow:hide,当我缩小时,我的固定div被推到了身体区域之外。
不幸的是,我无法更改正文(我只将div注入现有网站,并且与此页面的代码没有任何关联)

对任何解释/建议/想法都会感到满意! 谢谢。

修改
我在缩小到最大值时检查了视口的高度,html文档和最终可见的css-pixel

1440 document.documentElement.clientHeight
1486 document.documentElement.offsetHeight
1566 window.innerHeight

所以,移动设备似乎“切割fixed-div,因为它超出了HTML!?!

编辑2
取消激活现有的<meta name="viewport" content="width=device-width, initial-scale=1">
(以后不是一个真正的选项)并看到,现在我的chrome中的开发工具也显示了'结束' hmtl / body。更南方的一切都不可见;而不是我得到一个非常空的空白。

1 个答案:

答案 0 :(得分:0)

尝试将此行添加为开头后的第一行

<meta name="viewport" content="width=device-width, initial-scale=1.0">