`
DBear
  • 浏览: 231060 次
  • 性别: Icon_minigender_2
  • 来自: 上海
社区版块
存档分类

IE6下left绝对定位诡异错误

CSS 
阅读更多

      今天开发自己的一个小网站时出现一个诡异的错误:目标div明明设置了“position:absolute;left:0"的css样式,但是页面在IE6下显示出来,该div莫名的向右偏移了n多px,败家IE6没有办法监测dom,所以我只能猜。这个瞎猫碰死耗子的过程我就不描述了,只说结果:

 

      原因:绝对定位的div的外部父div因为没有设置高度,在IE6下默认成0,且不会因为内容而撑开,所以子div并没有被添加到父div中(因为没高度,所以没地方。。。)。这样就诡异的被挤出到了右侧。

 

      解决:为父div设置一个足够装下子div的高度,我是用js控制的。

 

 

 

      改进:我相信一定有改进方法,我的方法有点不专业了,清醒了以后再想。

分享到:
评论

相关推荐

    IE6下fixed实现头部定位

    在非IE6浏览器中,实现`fixed`定位只需在CSS中添加`position: fixed`,并指定`top`、`right`、`bottom`或`left`属性即可。但在IE6中,由于不支持`fixed`定位,我们需要寻找替代方案。一种常见的解决方法是利用...

    ie6下定位bug解决

    这段代码在IE6中将元素设置为绝对定位,并通过JavaScript表达式计算滚动条的位置,使元素保持在页面顶部。 2. **底部固定**: ```css _position: absolute; _bottom: auto; _top: expression(eval(document....

    解决ie6的定位问题 position fiexed

    2. **使用绝对定位替代固定定位**:对于IE6,使用`position: absolute;`代替`position: fixed;`,并通过JavaScript动态计算元素的位置。 3. **使用背景图片技巧**:通过设置`background-attachment: fixed;`来解决IE...

    如何解决IE6/7绝对定位元素神秘消失或被遮挡的方法

    另外,还可以通过CSS hack技术,比如使用负值的z-index来降低在IE下的层级,但这可能导致其他新的IE浏览器问题。 绝对定位元素的层级管理是通过z-index属性来实现的。以下是一些关于z-index的重要特性: 1. 相对...

    绝对定位和相对定位

    在网页设计和开发中,定位(Positioning)是布局的关键元素,主要分为两种类型:相对定位(Relative Positioning)和绝对定位(Absolute Positioning)。这两种定位方式都是CSS(层叠样式表,Cascading Style Sheets...

    css-绝对定位的参考对象

    在CSS中,我们使用`top`、`right`、`bottom`和`left`属性来调整绝对定位元素的位置。这些属性的值可以是像素、百分比或其他长度单位,它们表示元素与参考对象边界的距离。 例如: ```css .parent { position: ...

    IE6不支持fixed解决方法

    ` 将元素的定位模式改为绝对定位,这是因为在IE6中,`fixed`定位不能直接使用,我们需要通过绝对定位来模拟。 - `_top:expression(offsetParent.scrollTop);` 这个表达式是IE6特有的,它会动态地更新元素的垂直位置...

    ie6与ie7 8区别

    - **IE6、IE7、IE8的识别方式**:为了实现不同版本IE浏览器下的样式兼容性,开发者通常会采用CSS Hack技术来针对特定版本的IE编写样式规则。例如,使用`_`前缀可以让IE6识别,而不会被其他版本的IE或非IE浏览器识别...

    CSS 绝对定位属性absolute用法初探

    在CSS布局中,绝对定位(absolute positioning)是一种强大的定位机制,允许开发者精确地控制元素在网页上的位置。本文将深入探讨CSS绝对定位属性`absolute`的用法,并提供实例来帮助理解。 首先,理解`position`...

    人脸中的绝对定位.rar

    绝对定位在很多场景下都很有用,比如创建弹出框、拖放功能、图像画廊、复杂的用户界面等。然而,需要注意的是,过多使用绝对定位可能会导致布局难以维护,因为在不同屏幕尺寸和分辨率下,元素的位置可能变得不可预测...

    css margin-left在IE6下的问题的解决方法

    当一个元素在IE6中应用了`margin-left`属性,浏览器有时会错误地将其解析为两倍的值。例如,如果代码中定义了`margin-left: 20px`,IE6可能会将其显示为40px,这与预期的布局效果相去甚远,可能导致页面布局错乱。 ...

    CSS和Js演示网页绝对定位与相对定位,这些是我们从事前端编程的基础技能,应该学会的东西,这个小示例会告诉你绝对与相对的区别,以及如何去实现他们

    其中,理解并运用绝对定位和相对定位是基础技能之一,它们能够帮助开发者精确控制页面元素的位置,从而实现复杂且响应式的布局设计。 ### 绝对定位与相对定位的概念 1. **绝对定位(Absolute Positioning)**:当...

    IE绝对定位元素神秘消失或被遮挡的解决方法

    在网页设计中,IE浏览器(尤其是IE6和IE7)经常会出现一些与标准浏览器不同的表现,其中关于绝对定位元素的显示问题是一个常见的痛点。绝对定位是CSS布局中的一个重要概念,它允许元素脱离常规文档流,并根据相对于...

    css定位绝对相对定位

    ### CSS定位详解:绝对定位与相对定位 #### 相对定位(Relative Positioning) 相对定位是一种常见的CSS定位方式,它允许元素相对于其正常位置进行偏移。这种定位不会影响其他元素的位置。 - **定义**: 当元素...

    IE6, IE7, IE8 CSS 兼容速查表

    7. **定位问题**:IE6的绝对定位存在缺陷,需要设置`hasLayout`(如`position:absolute; zoom:1;`)才能正确工作。相对定位在IE6下也可能需要特别处理。 8. **边距重叠问题**:当浮动元素的子元素有外边距时,IE6会...

    CSS网页布局教程:绝对定位和相对定位

    3. **复杂布局**:在响应式设计中,绝对定位常用于在不同屏幕尺寸下调整元素位置。 ### 源码和工具 为了更好地理解绝对定位和相对定位,可以查看提供的"demo"文件。这个示例可能包含HTML和CSS代码,展示如何在实际...

    firefox下绝对定位元素重叠造成不可点击问题

    总之,解决Firefox下绝对定位元素重叠造成的不可点击问题,关键在于正确设置z-index、定位属性以及细心排查可能的CSS冲突。同时,不断学习和了解最新的布局技术,可以帮助我们更有效地处理这些问题。

    兼容IE6的遮罩层

    在早期的Web开发中,IE6浏览器由于其市场份额和用户需求,经常...在当前浏览器环境已高度兼容的背景下,虽然IE6的使用已经非常少,但理解这些历史遗留问题对理解Web发展史和提升跨浏览器兼容性能力仍然具有重要意义。

Global site tag (gtag.js) - Google Analytics