【css】ie6 和 ie7 下 position 与 overflow 的问题
2024-08-26 06:03:55
前几天做的项目中碰到这样一个问题,在 ie6 和 ie7 下,给父元素设置 overflow:hidden 不起作用无法隐藏,后来发现是子元素中有设置 position:relative,如果子元素删除 position:relative,那么父元素的 overflow:hidden 可以隐藏,具体代码及效果如下:
html 代码:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="renderer" content="webkit"/>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<title>Document</title>
<style>
*{margin:0;padding:0;}
.w{width:480px;margin:50px auto;}
.w ul{width:100%;overflow:hidden;height:144px;border:1px solid #f00;}
.w li{position:relative;height:36px;width:108px;border:1px solid #d1d1d1;line-height:36px;text-align:center;float:left;display:inline;margin:0 10px 10px 0;}
</style>
</head>
<body>
<div class="w">
<ul>
<li>111111111</li>
<li>222222222</li>
<li>333333333</li>
<li>444444444</li>
<li>555555555</li>
<li>666666666</li>
<li>777777777</li>
<li>888888888</li>
<li>999999999</li>
<li>000000000</li>
<li>111111111</li>
<li>222222222</li>
<li>333333333</li>
<li>444444444</li>
<li>555555555</li>
<li>666666666</li>
<li>777777777</li>
<li>888888888</li>
<li>999999999</li>
<li>000000000</li>
</ul>
</div>
</body>
</html>
ie6 和 ie7 下效果:
解决方法:
给父元素设置 position:relative。
最新文章
- 产品经理 - 移动支付+Pos收单分析
- Attribute和自定义Property
- savedInstanceState的作用
- Python QQ群
- 算法导论-钢条切割 C# 递归实现
- iphone dev 入门实例3:Delete a Row from UITableView
- lle算法
- 代码对齐 分类: C#小技巧 2014-04-17 14:45 166人阅读 评论(0) 收藏
- python3.5文档
- L8_2
- leetcode Valid Sudoku python
- 求知成瘾+逻辑成瘾+博识的无知,你中枪没?我感觉中枪了 - 外野 - Stage1st - Powered by Discuz!
- 深入浅出OpenStack云计算平台管理(nova-compute/network)
- Fiddler工具的基本功能(转)
- jQuery表格排序组件-tablesorter
- Linxu命令与文件的搜索 - which, whereis, locate, find
- Access使用记录
- Playmaker全面实践教程之简单的使用Playmaker示例
- 用python解析word文件(三):style
- eclipse在线安装maven插件
热门文章
- 一些CSS常见的小问题小笔记
- 5.4 String
- Windows Phone的简单学习
- Android:res之layer-list的用法
- 《Automatic Face Classification of Cushing’s Syndrome in Women – A Novel Screening Approach》学习笔记
- 在Ubuntu14.04 32位中安装mongodb
- apt-get程序和系统管理
- 从Mono 4.0观C# 6.0部分新特性
- Kali Linux Web 渗透测试视频教程— 第七课 OpenVas
- 更改MySql表和字段区分大小写