文章详情页
css - 移动端position:fixed;的兼容问题
浏览：170日期：2024-02-27 14:51:14
问题描述
pc端的网页，宽度必须是1200px，允许用户缩放，.topbar为相对于浏览器窗口浮动。
[正常]在PC端Chrome模拟手机、移动端Safari、微信缩放效果如下。
[错误]但是在安卓自带、UC中显示这样的，看了下应该是相对文档宽度
简化代码如下，实际环境看这里
<!DOCTYPE html><html><head> <meta charset='UTF-8'> <style>body{ width:1200px;}.topbar{ position: fixed; top: 0; left: 0; width: 100%; height: 40px;} </style></head><body> <p class='topbar'></p></body></html>
理论上说position: fixed;是相对于浏览器窗口的，不会出现第二种情况，但实际展示确实这样。我没有想到好的解决方案，求助。
问题解答
回答1：
这里有一个宽度固定值 导致不是100%
补充:
这里的效果不满足需求吗?
所以不用做width赋值操作了, 直接给width: auto就可以了.
标签：
CSS
上一条：android - Error: java.lang.IndexOutOfBoundsException: Invalid index 2下一条：css - 安卓内嵌H5，padding边距上下不一致
相关文章：
1. python - 在sqlalchemy中获取刚插入的数据id?2. css3 - 这个效果用 CSS 可以实现吗？border-image3. 关docker hub上有些镜像的tag被标记““This image has vulnerabilities””4. javascript - 在vue-cli引入vux后 使用报错5. android - 京东移动端网页和其app加载的url所做的呈现不应该是完全一样的吗？6. 站点内容复制额外增加的版权申明，真的很反人类。试问产品自己在用这个站点吗？7. css - 移动端 盒子内加overflow-y:scroll后 字体会变大8. javascript - 奇怪的Symbol的问题9. vue.js - vue 打包后 nginx 服务端API请求跨域问题无法解决。10. javamail发送邮件是否跟所在的网络环境有关？
排行榜
网公网安备