如果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. LVS负载均衡集群(DR)

    -----构建DR模式的LVS群集----- --client---------------------LVS------------------------WEB1----------------- ...

  2. cf245H Queries for Number of Palindromes (manacher+dp)

    首先马拉车一遍(或者用hash),再做个前缀和处理出f[i][j]表示以j为右端点,左端点在[i,j]的回文串个数 然后设ans[i][j]是[i,j]之间的回文串个数,那就有ans[i][j]=an ...

  3. 2018蓝桥杯 省赛D题(测试次数)

    x星球的居民脾气不太好,但好在他们生气的时候唯一的异常举动是:摔手机.各大厂商也就纷纷推出各种耐摔型手机.x星球的质监局规定了手机必须经过耐摔测试,并且评定出一个耐摔指数来,之后才允许上市流通.x星球 ...

  4. bzoj2252 矩阵距离

    很好奇这种 普及- 的题为什么会是权限题...... 我一开始想用枚举 + 搜索,看书后发现自己脑抽了.直接BFS即可. #include <cstdio> #include <qu ...

  5. A1043. Is It a Binary Search Tree

    A Binary Search Tree (BST) is recursively defined as a binary tree which has the following propertie ...

  6. C# Socket的安全关闭

    网络编程中,socket的安全关闭方法 /// <summary> /// Close the socket safely. /// </summary> /// <pa ...

  7. 关于继承的基本知识,方法重写,final和abstract的使用, 动态绑定和静态绑定的知识

    一.继承: 涉及关键字: extends(继承) super final abstract 特点: 1.类与类之间可以用 XX是XX来描述 , 那么他们之间就存在继承关系.  2.Java中不支持多继 ...

  8. socket关闭状态问题

    下面是对 譬如  “CLOSE_WAIT” 现象的一些解释: 主动关闭方和被动方经历的状态:FIN_WAIT_1(主动关闭一方): 当SOCKET在ESTABLISHED状态时,它想主动关     闭 ...

  9. https服务器配置部署

    现在很多网站都要是https,包括我之前做的微信小程序都是需要使用https传输的,特将之前学习的记录下,以防忘记 一. 1.HTTPS简介 HTTPS其实是有两部分组成:HTTP + SSL / T ...

  10. VirtualBox安装linux

    VBox相较于VMware要小巧,虚拟机该有的都有了.搭建记录下,学习... centos版本:CentOS-6.6-i386-bin-DVD1 VBox版本:6.0.4-128413-Win 之后可 ...