令人蛋疼的IE，IE6/IE7下父元素有相对/绝对定位时，子元素在IE6和IE7下overflow:hidden;失效。

情况一：（在parent上增加position:relative）

<style type="text/css">

	.parent{ width:100px; height:100px;border:1px solid #f00; overflow:hidden; position:relative;}

	.sonF{ position:relative;}

	.son{ width:100px; height:100px; position:absolute; left:0;top:0;}

	p{margin:0;padding:0;}

</style>

</head>

<body>

<div class="parent">

    <div class="sonF">

        <div class="son">

            <p>aaaaaaaaaaaaaa</p>

            <p>aaaaaaaaaaaaaa</p>

            <p>aaaaaaaaaaaaaa</p>

            <p>aaaaaaaaaaaaaa</p>

            <p>aaaaaaaaaaaaaa</p>

            <p>aaaaaaaaaaaaaa</p>

            <p>bbbb</p>

            <p>bbbbb</p>

        </div>

    </div>

</div>

情况二：（给son增加position:relative）

<style type="text/css">

	.parent{ width:100px; height:100px; position:absolute; border:1px solid #f00;}

	.son{ width:100px; height:100px;left:0;top:0; overflow:hidden; position:relative;}

	p{margin:0;padding:0;}

</style>

<div class="parent">

    <div class="son">

        <p>aaaaaaaaaaaaaa</p>

        <p>aaaaaaaaaaaaaa</p>

        <p>aaaaaaaaaaaaaa</p>

        <p>aaaaaaaaaaaaaa</p>

        <p>aaaaaaaaaaaaaa</p>

        <p>aaaaaaaaaaaaaa</p>

        <p>aaaaaaaaaaaaaa</p>

        <p>aaaaaaaaaaaaaa</p>

    </div>

</div>

如下图：

如果.parent中的position设置为absolute也是如此。

终上所述：

哪个需要设置overflow；hidden，生效，就在哪个上面设置position:relative;

解决IE6,IE7不能隐藏绝对定位溢出的内容的更多相关文章

  1. 解决IE6 IE7绝对定位弹层被后面的元素遮住

    解决IE6 IE7绝对定位弹层被后面的元素遮住? 弹层边框一直被后面的元素边框遮住,试了n种方法,只有这个比较好用. <div class="tuijian-table"&g ...

  2. 解决IE6/IE7/IE8不支持before,after问题

    对从事web开发的朋友来讲,低版本的IE永远是一个痛点,不支持最新技术(如css3,html5). 在现在web开发中使用图标字体已经很广泛,如Font Awesome,Bootstrap等,字体图片 ...

  3. 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后，子元素不随着滚动条滚动的问题

    解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题   在IE6,IE7下,子元素使用position:relati ...

  4. 一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行

    一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行

  5. 解决IE6 IE7 JSON.stringify JSON 未定义问题

    在项目中引入json2.js 官方http://www.json.org/ 源码地址:https://github.com/douglascrockford/JSON-js $.ajax({ url: ...

  6. clearfix 兼容IE6/IE7，解决ie6/ie7下多出一行的问题，bootstrap的clearfix的bug

    .clearfix:before, .clearfix:after { content: "."; display: block; height: ; overflow: hidd ...

  7. ie6,ie7,ie8 css bug兼容解决方法

    IE浏览器以不支持大量的css 属性出名,同时也因其支持的css属性中存在大量bug. 这里收集了好多的bug以及其解决的办法,都在这个文章里面记录下来了!希望以后解决类似问题的时候能够快速解决,也希 ...

  8. ie6,ie7,ie8 css bug兼容解决记录

    ie6,ie7,ie8 css bug兼容解决记录 转载自:ie6,ie7,ie8 css bug兼容解决记录 - 前端开发 断断续续的在开发过程中收集了好多的bug以及其解决的办法,都在这个文章里面 ...

  9. ie6,ie7,ie8 css bug汇总以及兼容解决方法

    1:li边距“无故”增加 任何事情都是有原因的,li边距也不例外. 先描述一下具体状况:有些时候li边距会突然增 加很多,值也不固定(只在IE6/IE7有这种现象),让人摸不着头脑,仔细“研究”发现是 ...

随机推荐

  1. C#程序中：如何启用进程、结束进程、查找进程

    在启动某个程序之前,如果需要先检查改程序是否已经运行,可以查找进程里有没有这个进程,再根据查找进程后的结果进行相应的判断操作. 产找进程的范围是任务管理器中的进程列表.如果进程被隐藏了,结果……(我没 ...

  2. CSS鼠标点击式变化图片透明度

    今天分享前端代码主题:jequery控制css图片透明度 很多时候在网站图片处理上需要实现一些辅助效果,比如鼠标在图片上滑动时或点击时改变图片颜色(变灰或者其他),其实一个简单的办法就是改变图片css ...

  3. "The connection for the USB device '###' was unsuccessful. The device is currently in use"

    一.问题描述 1.情景描述 笔者的物理主机系统是“windows7 64位”,想使用“摄像头录像大师”.这个软件在录制视频的过程中,需要调用windows自带的"windows media ...

  4. vim设置

    折腾一下vim http://www.cnblogs.com/zhangsf/archive/2013/06/13/3134409.html

  5. 手写js面向对象选项卡插件

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  6. [译]36 Days of Web Testing(三)

    Day 14: Automate the tedious Why ? 有些时候,web测试还是蛮单调乏味的,在开始测试前,你可能要必须跳转到一个特定的表单页面,或则为了得到一个特定的页面(或配置),你 ...

  7. C#转义字符总结

    转义字符 \·一种特殊的字符常量:·以反斜线"\"开头,后跟一个或几个字符.·具有特定的含义,不同于字符原有的意义,故称“转义”字符.·主要用来表示那些用一般字符不便于表示的控制代 ...

  8. spoj 4487. Can you answer these queries VI (gss6) splay 常数优化

    4487. Can you answer these queries VI Problem code: GSS6 Given a sequence A of N (N <= 100000) in ...

  9. GNOME Shell叫板Ubuntu Unity:优劣PK

    转自GNOME Shell叫板Ubuntu Unity:优劣PK GNOME Shell 对阵 Ubuntu Unity--默认桌面界面的战火一触即发.双方在台上已经对峙了很长时间,现在是时候决定谁会 ...

  10. PYTHON文本处理指南之日志LOG解析

    处理特定字段的内容,并指指定条件输出. 注意代码中用一个方法列表,并且将方法参数延后传递. GOOGLE作过PYTHON代码的水平,就是不一样呀. 希望能学到这种通用的技巧. 只是,英文PDF看起来有 ...