下面就是我所收集或遇到的IE6 Bug之一:overflow:hidden失效

当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:hidden属性就会失效。

CSS代码

复制代码代码如下:
#parent{height:50px;overflow:hidden;}
#child a{position:relative;}

HTML代码

复制代码代码如下:
<div id="parent">
<div id="child">
<a href="http://www.baidu.com/">百度</a>

<a href="http://www.jb51.net/">脚本之家</a>

<a href="http://s.jb51.net/">服务器</a>

<a href="http://tools.jb51.net">查询工具</a>

<a href="http://www.jb51.net/softs">软件下载</a>

<a href="http://www.jb51.net/codes">源码下载</a>

</div>
</div>

我们在IE 6内发现子元素会超出父元素设定的高度,即使父元素设置了overflow:hidden。
解决这个bug很简单,在父元素中使用position:relative;即可解决该bug

即css

复制代码代码如下:
#parent{height:50px;overflow:hidden;position:relative;}
#child a{position:relative;}

IE6 Bug overflow:hidden失效的更多相关文章

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

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

  2. overflow:hidden失效问题

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

  3. overflow:hidden失效

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

  4. IE6、7下overflow:hidden失效的问题

    问题产生原因: 当父元素的直接子元素或者下级子元素的样式拥有position:relative或者position:absolute属性时,父元素的overflow:hidden属性就会失效. 例如: ...

  5. IE下设置body{overflow:hidden;}失效Bug

    问题重现: <p>There are no scrollbars on this page in sane browsers</p> html, body, p { margi ...

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

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

  7. 解决 border-radius 元素在应用了 transform 的子元素 时overflow:hidden 失效的问题

    受大家启迪,于是最近深入研究了一下Css3中的一些属性.之中也是碰到了个不为我知的问题,在这里特此总结并与大家分享. 问题重现:在父元素上应用了 border-radius 的圆角属性.加上  ove ...

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

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

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

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

随机推荐

  1. [学习笔记]设计模式之Singleton

    写在前面 为方便读者,本文已添加至索引: 设计模式 魔法手札索引 在前几篇笔记中,我们有了解了部分对象创建型模式,包括Builder(建造者).Abstract Factory(抽象工厂)和Facto ...

  2. Intent是什么?

    一.理解Intent: 在一个Android应用中,主要是由四种组件组成的,这四种组件可参考“Android应用的构成”.而这四种组件是独立的,它们之间可以互相调用,协调工作,最终组成一个真正的And ...

  3. ServletContext和ServletConfig

    一.ServletConfig对象 1 .作用 ServletConfig对象: 主要是用于加载servlet的初始化参数. 在一个web应用可以存在多个ServletConfig对象(一个Servl ...

  4. Bison executable not found in PATH by mysql install

    [root@luozhonghua mysql-5.5.21]# cmake . -DCMAKE_INSTALL_PREFIX=/usr/local/mysql  -DMYSQL_DATADIR=/d ...

  5. javamail发送邮件的简单实例(转)

    今天学习了一下JavaMail,javamail发送邮件确实是一个比较麻烦的问题.为了以后使用方便,自己写了段代码,打成jar包,以方便以后使用.呵呵 注意:要先导入javamail的mail.jar ...

  6. php通过文件头检测文件类型通用类(zip,rar…)(转)

    在做web应用时候,通过web扩展名判断上存文件类型,这个是我们常使用的.有时候我们这样做还不完善.可能有些人上存一些文件,但是他通过修改 扩展名,让在我们的文件类型之内. 单实际访问时候又不能展示( ...

  7. mac下mysql5.6字符集设置

    http://geeksblog.cc/2016/05/28/mac-mysql-unicode/   mac下mysql5.6字符集设置: 在mac下设置mysql5.6字符集时踩过的坑,百分百保证 ...

  8. REDIS 源码

    http://blog.csdn.net/chosen0ne https://github.com/chosen0ne/task-schedule-simulate

  9. WebService学习笔记系列(一)

    webservice主要是解决两个系统或者两个应用程序之间的远程调用,它提供了一种通过web方式访问的api,调用是跨语言.跨平台的. webservice的客户端与服务端进行交互的时候使用xml来传 ...

  10. JavaScript 开发规范要求详解

    作为一名开发人员(We前端JavaScript开发),不规范的开发不仅使日后代码维护变的困难,同时也不利于团队的合作,通常还会带来代码安全以及执行效率上的问题.本人在开发工作中就曾与不按规范来开发的同 ...