IE6 Bug overflow:hidden失效
下面就是我所收集或遇到的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失效的更多相关文章
- IE6,IE7上设置body{overflow:hidden;}失效Bug
IE6,IE7下设置body{overflow:hidden;}失效Bug 最近做项目发现在IE7下设置body{overflow:hidden;}后还是会出现纵向滚动条,所以上网查查了,在这里记录一 ...
- overflow:hidden失效问题
2018-08-03 Questions about work 这几天开发的时候遇到了个问题,如图1. 写了个demo demo 地址 由于页面并没有进行整体缩放,导致在小屏幕手机上显示会有异常.PM ...
- overflow:hidden失效
overflow:hidden失效 为了页面的健壮性,我们常常需要使用overflow:hidden.有时候是为了防止布局被撑开,有时候是为了配合其它规则实现文字截断,还有时候纯粹是为了创建块级上下文 ...
- IE6、7下overflow:hidden失效的问题
问题产生原因: 当父元素的直接子元素或者下级子元素的样式拥有position:relative或者position:absolute属性时,父元素的overflow:hidden属性就会失效. 例如: ...
- IE下设置body{overflow:hidden;}失效Bug
问题重现: <p>There are no scrollbars on this page in sane browsers</p> html, body, p { margi ...
- 在ie7中overflow:hidden失效问题及解决方案
css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...
- 解决 border-radius 元素在应用了 transform 的子元素 时overflow:hidden 失效的问题
受大家启迪,于是最近深入研究了一下Css3中的一些属性.之中也是碰到了个不为我知的问题,在这里特此总结并与大家分享. 问题重现:在父元素上应用了 border-radius 的圆角属性.加上 ove ...
- css ie7中overflow:hidden失效问题及解决方法
css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...
- border-radius导致overflow:hidden失效问题。
如果一个父元素设置了overflow:hidden属于的同时还设置了border-radius属性,那么如果想隐藏超出的子元素,四个圆角处会出现超出圆角依然显示的bug: 一种方法是运用-webkit ...
随机推荐
- [学习笔记]设计模式之Singleton
写在前面 为方便读者,本文已添加至索引: 设计模式 魔法手札索引 在前几篇笔记中,我们有了解了部分对象创建型模式,包括Builder(建造者).Abstract Factory(抽象工厂)和Facto ...
- Intent是什么?
一.理解Intent: 在一个Android应用中,主要是由四种组件组成的,这四种组件可参考“Android应用的构成”.而这四种组件是独立的,它们之间可以互相调用,协调工作,最终组成一个真正的And ...
- ServletContext和ServletConfig
一.ServletConfig对象 1 .作用 ServletConfig对象: 主要是用于加载servlet的初始化参数. 在一个web应用可以存在多个ServletConfig对象(一个Servl ...
- 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 ...
- javamail发送邮件的简单实例(转)
今天学习了一下JavaMail,javamail发送邮件确实是一个比较麻烦的问题.为了以后使用方便,自己写了段代码,打成jar包,以方便以后使用.呵呵 注意:要先导入javamail的mail.jar ...
- php通过文件头检测文件类型通用类(zip,rar…)(转)
在做web应用时候,通过web扩展名判断上存文件类型,这个是我们常使用的.有时候我们这样做还不完善.可能有些人上存一些文件,但是他通过修改 扩展名,让在我们的文件类型之内. 单实际访问时候又不能展示( ...
- mac下mysql5.6字符集设置
http://geeksblog.cc/2016/05/28/mac-mysql-unicode/ mac下mysql5.6字符集设置: 在mac下设置mysql5.6字符集时踩过的坑,百分百保证 ...
- REDIS 源码
http://blog.csdn.net/chosen0ne https://github.com/chosen0ne/task-schedule-simulate
- WebService学习笔记系列(一)
webservice主要是解决两个系统或者两个应用程序之间的远程调用,它提供了一种通过web方式访问的api,调用是跨语言.跨平台的. webservice的客户端与服务端进行交互的时候使用xml来传 ...
- JavaScript 开发规范要求详解
作为一名开发人员(We前端JavaScript开发),不规范的开发不仅使日后代码维护变的困难,同时也不利于团队的合作,通常还会带来代码安全以及执行效率上的问题.本人在开发工作中就曾与不按规范来开发的同 ...