IE overflow:hidden失效的解决方法

2024-06-04 03:58

本文主要是介绍IE overflow:hidden失效的解决方法,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

position和float是两种布局模式,在IE6下共用有时会导致用position定位的元素节点消失。绝对定位的元素节点是参照离它最近的已定位元素,所以父节点定位relative、子节点定位absolute是很常见的。


overflow:hidden失效
当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:hidden属性就会失效。
我们在IE 6内发现子元素会超出父元素设定的高度,即使父元素设置了overflow:hidden。
解决这个bug很简单,在父元素中使用position:relative;即可解决该bug

我的办法:子元素设置绝对定位,父元素相对定位,这样overflow:hidden就不会失效了。

IE下CSS溢出隐藏失败(IE overflow:hidden失效)

html代码:

   

服务范围

  • 品牌官网设计

    设计、策划、制作全方位周边产品让你省心的一条龙服务。充分了解企业文化、行业特点,体现企业特色。 设计师一对一沟通,充分了解你的需求和想法。 时刻掌握最新技术动向,打造高品质网站。

  • 专业量身定制开发,定制设计、定制功能。拥有一支资深开发工程师团队,追求质量同时保证速度。追求完美,不断提升系统响应速度和稳定性。完善的测试流程,在上线之前解决问题

    商城网站建设

  • 手机、微信网站建设

    个性设计,独一无二,用设计风格体现企业文化。精简代码、追求速度,兼容主流手机浏览器。和PC端数据同步,管理方便,全方位网络营销。零成本增加微信网站。

  • 其他网站定制

    旅游官网、旅游平台等网站定制外贸网站、外贸商城等网站定制门户网站、教育平台等网站定制内部管理系统等其他网站定制

  • 站内优化如同打地基,地基不稳,网站怎能推广成功合理配置网站标题、关键词、描述优化页面代码,利于搜索引擎抓取网站地图、robots设置、404错误设置

    SEO基础优化

  • 域名服务

    个性设计,独一无二,用设计风格体现企业文化。精简代码、追求速度,兼容主流手机浏览器。和PC端数据同步,管理方便,全方位网络营销。零成本增加微信网站



ul的宽度为2000,而他的父级div设置的宽度为1000,并且设置了overflow:hidden,但是在ie中多出来的ul部分并没有被隐藏掉。

原因是我的li元素加了定位,position:relative,解决办法是在父节点容器 中也加一个position:relative。在#con的div中也加上position:relative,问题得到解决。


我的css代码:

div#scope_con div#con{width:1000px;height: auto;overflow: hidden;margin:30px auto;border: solid 1px red;position: relative;}
div#scope_con div#con ul{width:2000px;overflow: hidden;border:solid 1px green;}
div#scope_con div#con li{list-style: none;float: left;width: 333px;height: 400px;background:#d04d43;position: relative;}
div#scope_con div#con li img{width: 333px;height:200px;border:0px;}
div#scope_con div#con li#sc img,div#scope_con div#con li#yh img{margin-top:40px}

这篇关于IE overflow:hidden失效的解决方法的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1029001

相关文章

Android 12解决push framework.jar无法开机的方法小结

《Android12解决pushframework.jar无法开机的方法小结》:本文主要介绍在Android12中解决pushframework.jar无法开机的方法,包括编译指令、框架层和s... 目录1. android 编译指令1.1 framework层的编译指令1.2 替换framework.ja

在.NET平台使用C#为PDF添加各种类型的表单域的方法

《在.NET平台使用C#为PDF添加各种类型的表单域的方法》在日常办公系统开发中,涉及PDF处理相关的开发时,生成可填写的PDF表单是一种常见需求,与静态PDF不同,带有**表单域的文档支持用户直接在... 目录引言使用 PdfTextBoxField 添加文本输入域使用 PdfComboBoxField

SQLyog中DELIMITER执行存储过程时出现前置缩进问题的解决方法

《SQLyog中DELIMITER执行存储过程时出现前置缩进问题的解决方法》在SQLyog中执行存储过程时出现的前置缩进问题,实际上反映了SQLyog对SQL语句解析的一个特殊行为,本文给大家介绍了详... 目录问题根源正确写法示例永久解决方案为什么命令行不受影响?最佳实践建议问题根源SQLyog的语句分

Java NoClassDefFoundError运行时错误分析解决

《JavaNoClassDefFoundError运行时错误分析解决》在Java开发中,NoClassDefFoundError是一种常见的运行时错误,它通常表明Java虚拟机在尝试加载一个类时未能... 目录前言一、问题分析二、报错原因三、解决思路检查类路径配置检查依赖库检查类文件调试类加载器问题四、常见

解决IDEA报错:编码GBK的不可映射字符问题

《解决IDEA报错:编码GBK的不可映射字符问题》:本文主要介绍解决IDEA报错:编码GBK的不可映射字符问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录IDEA报错:编码GBK的不可映射字符终端软件问题描述原因分析解决方案方法1:将命令改为方法2:右下jav

Java 中的 @SneakyThrows 注解使用方法(简化异常处理的利与弊)

《Java中的@SneakyThrows注解使用方法(简化异常处理的利与弊)》为了简化异常处理,Lombok提供了一个强大的注解@SneakyThrows,本文将详细介绍@SneakyThro... 目录1. @SneakyThrows 简介 1.1 什么是 Lombok?2. @SneakyThrows

MyBatis模糊查询报错:ParserException: not supported.pos 问题解决

《MyBatis模糊查询报错:ParserException:notsupported.pos问题解决》本文主要介绍了MyBatis模糊查询报错:ParserException:notsuppo... 目录问题描述问题根源错误SQL解析逻辑深层原因分析三种解决方案方案一:使用CONCAT函数(推荐)方案二:

判断PyTorch是GPU版还是CPU版的方法小结

《判断PyTorch是GPU版还是CPU版的方法小结》PyTorch作为当前最流行的深度学习框架之一,支持在CPU和GPU(NVIDIACUDA)上运行,所以对于深度学习开发者来说,正确识别PyTor... 目录前言为什么需要区分GPU和CPU版本?性能差异硬件要求如何检查PyTorch版本?方法1:使用命

Qt实现网络数据解析的方法总结

《Qt实现网络数据解析的方法总结》在Qt中解析网络数据通常涉及接收原始字节流,并将其转换为有意义的应用层数据,这篇文章为大家介绍了详细步骤和示例,感兴趣的小伙伴可以了解下... 目录1. 网络数据接收2. 缓冲区管理(处理粘包/拆包)3. 常见数据格式解析3.1 jsON解析3.2 XML解析3.3 自定义

SpringMVC 通过ajax 前后端数据交互的实现方法

《SpringMVC通过ajax前后端数据交互的实现方法》:本文主要介绍SpringMVC通过ajax前后端数据交互的实现方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价... 在前端的开发过程中,经常在html页面通过AJAX进行前后端数据的交互,SpringMVC的controll