`

IE7下POSITION:RELATIVE与OVERFLOW的问题

    博客分类:
  • css
ie 
阅读更多

父容器设置overflow:auto;子元素设置属性position:relative;在ie6、ie7中该子元素不随滚动条滚动。

解决办法:

给设置了overflow:auto属性的父容器也加上position:relative。

下面贴出代码:

<div style="width:200px;height:300px; overflow:auto;"> <div style="width:100px;height:500px;"> <p>ie7动</p> <p style="position:relative;">position:relative;ie7不动</p> <p>ie7动</p> </div></div>

http://hi.baidu.com/danghj/item/d686331399297fa4feded5df

分享到:
评论

相关推荐

    css中position:relative和overflow:hidden之间的问题

    在本问题中,我们主要关注`position:relative`和`overflow:hidden`之间的交互,以及在不同浏览器(尤其是IE6和IE7)中的表现差异。 `position`属性用于定义元素的定位模式,它有多种值,如`static`(默认值)、`...

    如何用float配合position:relative实现居中

    在这个场景下,`float`与`position:relative`结合使用可以达到预期的居中效果,而避免使用对这些老版本IE浏览器支持不理想的`display:inline-block`。以下我们将详细探讨这种实现方法。 首先,我们了解`float`属性...

    ie7中overflow:auto无效的解决方法

    产生原因当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:auto属性就会失效。 解决办法解决这个bug很简单,在父元素中使用position:relative;即可解决该bug。 代码bug重现 ...

    解决IE6,IE7不能隐藏(overflow:hidden)绝对定位溢出的内容

    令人蛋疼的IE,IE6/IE7下父元素有相对/绝对定位时,子元素在IE6和IE7下overflow:hidden;失效。 情况一:(在parent上增加position:relative) 复制代码代码如下: &lt;style type=”text/css”&gt; .parent{ width:...

    IE overflow:hidden失效的解决方法

    overflow:hidden失效 当父元素的直接子元素或者下级子元素的样式拥有position:relative属性时,父元素的overflow:hidden属性就会失效。 我们在IE 6内发现子元素会超出父元素设定的高度,即使父元素设置了overflow:...

    IE6 Bug overflow:hidden失效

    总之,`IE6 Bug overflow:hidden失效`是一个经典且知名的CSS兼容性问题,它涉及到`position:relative`与`overflow:hidden`的交互。通过为父元素添加`position:relative`可以修复此问题,但这也可能带来其他的布局...

    ie6、ie7下overflow失效的有效解决方法

    但在IE6和IE7这两个旧版本的浏览器中,当父元素设置了overflow: hidden属性,并且子元素应用了position: relative或position: absolute定位属性时,就会出现overflow属性失效的情况,即无法隐藏溢出的子元素内容。...

    CSS表达式(expression)解决IE6 position:fixed无效问题

    在网页开发中,IE6(Internet Explorer 6)的许多特性与现代浏览器存在不兼容性,其中`position:fixed`就是一个典型例子。`position:fixed`在其他浏览器中可以让元素保持在视口的固定位置,不论用户如何滚动页面,但...

    js完美解决IE6不支持position:fixed的bug

    因此,尽管这种方法可以解决IE6下的`position:fixed`问题,但它并不是最佳实践。随着IE6的使用率逐渐降低,更推荐的方法是逐步停止对它的支持,转而专注于更现代的浏览器和更高效的前端技术。 总的来说,解决IE6不...

    IE6 position:fixed bug (固定窗口方法)

    在Web开发中,IE6浏览器常常给开发者带来诸多挑战,其中一个问题就是对于CSS中的`position:fixed`属性的支持。`position:fixed`通常用于创建一个固定定位的元素,使其在页面滚动时仍然保持在屏幕的某个位置。然而,...

    ie特有bug文档

    - **问题描述**:在IE6/7中,当子元素具有`position: relative`属性时,将父元素设置为`overflow: [hidden | auto]`等同于将子元素的定位模式重置为默认的`position: static`。 - **解决方案**:为父元素设置`...

    css兼容IE6、IE7、FF的技巧

    - **IE6的定位问题**:IE6对于`position: absolute`或`position: relative`的元素位置计算有误。 - **解决方法**: - 直接设置`.line-height`等于当前div的高度,并通过`vertical-align: middle`来居中显示。 - ...

    三星9305收索

    你就知道&lt;/title&gt;&lt;style index="index" &gt;html,body{height:100%}html{overflow-y:auto}#wrapper{position:relative;_position:;min-height:100%}#head{padding-bottom:100px;text-align:center;*z-index:1}#ftCon{...

    css中position:fixed实现div在窗口上下左右居中

    通过position属性,我们可以控制元素的位置关系,常见的定位属性值包括static、relative、absolute和fixed等。其中,position:fixed是一种特殊的定位方式,它可以使元素相对于浏览器窗口进行定位,而与文档流无关,...

    IE下实现text框圆角显示

    在本篇文章中,我们将深入探讨如何通过各种技术手段来解决这个问题,使得文本框在IE浏览器中也能呈现出优雅的圆角效果。 首先,让我们了解`border-radius`属性的基本概念。`border-radius`是CSS3引入的一个新特性,...

    IE6/7在滚动区域内的标签使用position会飘出这个滚动区域不随滚动条滚动

    上述问题所描述的正是IE6和IE7在处理`position`属性时的一个经典bug。当在一个具有滚动条的`div`元素内部,子元素设置了`position: absolute`或`position: relative`时,这些子元素不会随滚动条滚动,而是超出滚动...

Global site tag (gtag.js) - Google Analytics