问题重现:

<p>There are no scrollbars on this page in sane browsers</p>
html, body, p { margin: 0; padding: 0; } body { overflow: hidden; } p { width: 5000px; height: 5000px; }
IE6 IE7下不生效(IE6下横向纵向滚动条都在 IE7下纵向滚动条还在)

原因:

明智的浏览器(ex. chrome and firefox)会初始付值给html{overflow:visible;}

IE6 初始付值html{overflow-x:auto;overflow-y:scroll;}

IE7 初始付值html{overflow-x:visible;overflow-y:scroll;}

只有dom根结点(也就是html根节点)设置html{overflow:visible;}的时候,浏览器才会将body元素中的overflow值应用到视图区。

举个例子说:

设置了body{overflow:hidden},还会出现滚动条,不过这个滚动条不是body的,是html的
只有你设置html{overflow:visible;} body{overflow的值}才能传递到html{}中去
这样html的值就变成了{overflow:hidden},ok没有滚动条了

这样就很明了啦,并不是bug,而是浏览器初始值不同产生的问题。

解决办法:

html, body, p { margin: 0; padding: 0; } html { overflow: visible; } body { overflow: hidden; } p { width: 5000px; height: 5000px; }

IE下设置body{overflow:hidden;}失效Bug的更多相关文章

  1. IE6,IE7上设置body{overflow:hidden;}失效Bug

    IE6,IE7下设置body{overflow:hidden;}失效Bug 最近做项目发现在IE7下设置body{overflow:hidden;}后还是会出现纵向滚动条,所以上网查查了,在这里记录一 ...

  2. IE6 Bug overflow:hidden失效

    下面就是我所收集或遇到的IE6 Bug之一:overflow:hidden失效 当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:hidd ...

  3. 在ie7中overflow:hidden失效问题及解决方案

    css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...

  4. css ie7中overflow:hidden失效问题及解决方法

    css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...

  5. overflow:hidden失效问题

    2018-08-03 Questions about work 这几天开发的时候遇到了个问题,如图1. 写了个demo demo 地址 由于页面并没有进行整体缩放,导致在小屏幕手机上显示会有异常.PM ...

  6. border-radius导致overflow:hidden失效问题。

    如果一个父元素设置了overflow:hidden属于的同时还设置了border-radius属性,那么如果想隐藏超出的子元素,四个圆角处会出现超出圆角依然显示的bug: 一种方法是运用-webkit ...

  7. ie6-7 overflow:hidden失效问题的解决方法

    即使父元素设置了overflow:hidden.解决这个bug很简单,在父元素中使用position:relative; zoom: 1;触发haslayout 即可解决该BUG.

  8. overflow:hidden失效

    overflow:hidden失效 为了页面的健壮性,我们常常需要使用overflow:hidden.有时候是为了防止布局被撑开,有时候是为了配合其它规则实现文字截断,还有时候纯粹是为了创建块级上下文 ...

  9. 若父设置了overflow: hidden;子如何不受影响

    若父设置了overflow: hidden;子如何不受影响 1.如图: 2.只需要给一个position: absolute;定位 3.相当于重新给页面进行定位,右侧便会有滚动条出现. 4.overf ...

随机推荐

  1. POJ1631 LIS模板

    题目:http://poj.org/problem?id=1631 两种nlogn的方法. 1.树状数组优化暴力.有种扫描线的感觉,以时间保证位置,把值作为数组脚标. 2.记录长为...的上升子序列末 ...

  2. Netty源码分析之NioEventLoop(一)—NioEventLoop的创建

    一.NioEventLoop的概述 NioEventLoop做为Netty线程模型的核心部分,从本质上讲是一个事件循环执行器,每个NioEventLoop都会绑定一个对应的线程通过一个for(;;)循 ...

  3. FileStream 和StreamWriter 一起用时

    StreamWriter  Flush 即可. FileStream Flush 无用.

  4. Guid 几种格式化

    //32 位数字:00000000000000000000000000000000 Console.WriteLine(Guid.NewGuid().ToString("N")); ...

  5. bzoj 4842: [Neerc2016]Delight for a Cat

    Description ls是一个特别堕落的小朋友,对于n个连续的小时,他将要么睡觉要么打隔膜,一个小时内他不能既睡觉也打隔膜 ,因此一个小时内他只能选择睡觉或者打隔膜,当然他也必须选择睡觉或打隔膜, ...

  6. Floyd最短路径算法(来自微信公众号“算法爱好者”改编)

    暑假,小哼准备去一些城市旅游.有些城市之间有公路,有些城市之间则没有,如下图.为了节省经费以及方便计划旅程,小哼希望在出发之前知道任意两个城市之前的最短路程. 上图中有4个城市8条公路,公路上的数字表 ...

  7. javascript对象讲解

    js的数据类型 基本数据类型:string   undefined   null   boolean    number 引用数据类型:object 二者的区别: 基本数据类型就是简单的赋值,引用数据 ...

  8. Apache JMeter配置、安装

    一. 工具描述 apache jmeter是100%的java桌面应用程序,它被设计用来加载被测试软件功能特性.度量被测试软件的性能.设计jmeter的初衷是测试web应用,后来又扩充了其它的功能.j ...

  9. 详解UE4静态库与动态库的导入与使用

    转自:http://blog.csdn.net/u012999985/article/details/71554628 一.基本内容概述   最近做项目时经常看到build.cs文件,就想研究一下UE ...

  10. 含有不等式约束的优化问题——KKT条件

    优化问题: 其中, 定义:对于一个不等式约束,如果,那么称不等式约束是处起作用的约束. 定义:设满足,设为起作用不等式约束的下标集: 如果向量:是线性无关的,则称是一个正则点. 下面给出某个点是局部极 ...