文章详情页
css - 移动端position:fixed;的兼容问题
浏览:193日期: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. celery+redis 怎么看redis里面的内容2. 为什么redis中incr一个“0” 会报错?3. javascript - 最近用echarts做统计图时遇到两个问题!!4. android - TextInputLayout的空白显示问题5. android - 优酷的安卓及苹果app还在使用flash技术吗?6. css内联样式的style7. java - 一个泛型标签问题8. java类中的成员成员变量赋值之后什么时候会被回收,有什么办法监听到某一个对象被回收吗9. css - input中transition 设置background-color过渡,chrome浏览器页面初始化渲染会有过度效果10. nginx - 关于vue项目部署到ngnix后出现的问题
排行榜

网公网安备