`<body>` 上的 `position: fixed` 有问题吗? [英] Is `position: fixed` on `<body>` problematic?
问题描述
在移动设备和桌面浏览器的 SPA 上，我需要在 上设置 position: fixed 以避免 iOS 的溢出/rubberband 滚动.
position:fixed 和 上的修改总是有点hacky 和导致问题的风险.
这就是我想澄清的原因:
是否有任何已知问题/注意事项/需要注意的事项(即堆叠上下文、z-indexing 上下文、子项的静态/相对/绝对/固定定位)/... 添加 position 时: 固定到
位置:固定"与相对于浏览器窗口定位的元素"有关.网页浏览器缩放受其影响.IE6 及以下也将与它决裂.
也许会更好:
html, body { 高度:100%;溢出:自动；}身体 .element { 位置:固定；底部:0；}然后对于 html:
<div class="元素">(这里的其他一切)On a SPA for mobile devices and desktop browsers I need to set position: fixed on <body> to avoid iOS' overflow/rubberband scrolling.
position: fixed and modifications on the <body> are always somewhat hacky and risky to cause problems.
This is why I wanted to clarify:
Are there any known problems / caveats / things to watch out for (i.e. stacking context, z-indexing context, static/relative/absolute/fixed positioning on children) / ... when adding position: fixed to <body>
The "position: fixed" relates to an "element" positioned relative to the browser window. Webpage browser zooming is affected by it. IE6 and below will also break with it.
Perhaps it would be better as:
html, body { height: 100%; overflow: auto; }
body .element { position:fixed; bottom: 0; }
Then for the html:
<body>
<div class="element">
(everything else inside here)
</div>
</body>
这篇关于`<body>` 上的 `position: fixed` 有问题吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
