如果position:fixed 失效,那应该是你设置position的元素的父元素中有设置了transform属性哦 。

把 transform删除或设置为none就可以解决啦。

但是如果transform是必要的,不能删除,我们可以在此父级最外层再加一层元素专门用于定位,这样position:fixed就能生效啦。

举个栗子:

/* 一定要将ancestor和parent的大小设置为一样大*/
.ancestor{
position: relative; /*重点*/
width: 300px;
height: 300px;
}
.parent {
width: 300px;
height: 300px;
overflow: auto; /*重点*/
}
.child {
position: absolute;/*重点*/
width: 320px;
height: 320px;
}
嗯...大概意思就这样。

position:fixed 失效的更多相关文章

  1. position:fixed失效

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. position:fixed失效情况

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. 偏前端 - ios下position:fixed失效的问题解决

    如图,考虑到用户体验的问题,一般页面的下方提交按钮都会随着固定在页面上,方便用户点击. 有些人肯定就说了,这还不简单,position:fixed: 但是在ios这个坑货系统上这个position:f ...

  4. ios解决输入框弹出后position:fixed失效问题

    最近在使用AmazeUI进行仿App Mobile Web开发时遇到了讨论众多的position:fixed问题.position:fixed在安卓2.2以上已经实现,但是在ios8以下系统当小键盘激 ...

  5. position:fixed 失效问题

    为了提升动画性能,在body上加上了transform:translate3d(0,0,0) 但是3d使得新建了一个层(具体原因请参考:高性能css动画),导致position:fixed不在当前的层 ...

  6. position:fixed失效问题

    fixed定位的元素,如果父级有transform样式,值不为none,那么fixed定位就会失效. 解决方法:使用transform样式的元素,不要包含fixed定位的子元素.

  7. ios上position:fixed失效问题

    手机端上的猫腻真是多啊~~~ 此起彼伏! 最近又遇到了 固定定位的底部导航在ios上被弹出去 此时内心1w+个草泥马奔过~~~~~~~~ 直接上解决方案: <div class="ma ...

  8. 不受控制的 position:fixed

    本文为纯理论文章,没有 Demo,没有配图,可能会略微枯燥. 大家都知道,position:fixed 在日常的页面布局中非常常用,在许多布局中起到了关键的作用.它的作用是: position:fix ...

  9. 五行代码终极完美解决从IE6到Chrome所有浏览器的position:fixed;以及闪动问题

    这个方法其实已经使用很久了,之前主要在嵌入式WebQQ等产品中用过,现在拿出来分享一下吧,是目前最简洁的方式来实现ie6的position:fixed; 失效bug,以及的其他方法的闪动问题,CSS代 ...

随机推荐

  1. 解决关于confluence缓慢 字体乱码 宏乱码 编辑不能贴图等问题

    应用场景:Confluence软件不用多说,与Jira一样,都是atlassion的精品软件,不再介绍. 这里因为使用的是破解版的confluence,故遇见一些问题,只能百度谷歌自行解决,也在此记录 ...

  2. 解决SecureCRT无法用非root账号登录ssh

    原文: http://blog.csdn.net/zxx2403/article/details/46959047 链接失败,提示这个: --------------------------- Sec ...

  3. poj1845 Sumdiv

    poj1845 Sumdiv 数学题 令人痛苦van分的数学题! 题意:求a^b的所有约数(包括1和它本身)之和%9901 这怎么做呀!!! 百度:约数和定理,会发现 p1^a1 * p2^a2 * ...

  4. poj1193 内存分配

    气死我了...这个毒瘤内存分配..... 优先队列 + 链表模拟,看起来搞一搞就好了却WA来WA去... 最后对拍手动找才发现错误: erase的时候不要急急忙忙插入wait!要把同一时期的erase ...

  5. JavaScript深入之从原型到原型链

    构造函数创建对象 我们先使用构造函数创建一个对象: function Person(){} var person = new Person(); person.name = 'Kevin'; cons ...

  6. loj6045 价

    题目链接 思路 从源点\(S\)向每种药连一条边权为\(-p+inf\)的边.从每种药向他所需要的药材连一条边权为\(INF\)的边.从每种药材向汇点\(T\)连一条边权为\(inf\)的边. \(I ...

  7. TestNg-数据驱动-dataProvider

    参考https://blog.csdn.net/hjianhui24/article/details/50554828 之前的用例自己一笔一划写出来的,知道了数据驱动的概念之后,修改了一下用例. @D ...

  8. POJ 3463 Sightseeing (次短路经数)

    Sightseeing Time Limit: 2000MS   Memory Limit: 65536K Total Submissions:10005   Accepted: 3523 Descr ...

  9. xp与win7双系统时删除win7启动菜单

    1.提取Win7安装光盘中,boot目录下的[bootsect.exe]到其它盘中,备用! 2 2.启动到WinXP或者WinPE或者Dos中,只要是能执行dos命令的地方就可以 3 3.cmd下进入 ...

  10. (贪心)nyoj448-寻找最大数

    题目描述: 请在整数 n 中删除m个数字, 使得余下的数字按原次序组成的新数最大, 比如当n=92081346718538,m=10时,则新的最大数是9888 输入描述: 第一行输入一个正整数T,表示 ...