在固定宽度内使元素 100% 成为主体 - IE6 BUG答案

【问题标题】：Make element 100% of body when inside fixed width - IE6 BUG在固定宽度内使元素 100% 成为主体 - IE6 BUG
【发布时间】：2013-02-25 22:47:40
【问题描述】：

很确定这是一个 IE6 错误，因为它适用于所有其他浏览器。

jsFiddle of this html code：

        <div style="background:blue; width:600px; margin-left:auto; margin-right:auto;">
            BLUE
            <div style="background:red; position:absolute; width:100%; left:0;">
                red
            </div>
        </div>

因此，“RED” div 应该是其容器（在本例中为主体）的 100% 宽度。在 IE6 中它始终是 600px。是否有不涉及忽略ie6的修复程序？（我希望我能，相信我！）

【问题讨论】：

如果没有 CSS 和完整的 HTML，我无法为您提供帮助。并且有一个会员 1 年 - 4 个月你必须明白我的意思。
您可以尝试将position: relative 设置为正文。
如今只有大约 1% 的访问者使用 IE6 浏览器。我不会在意它。
它的容器是父div而不是body。
我已将“1%”注释标记为在这种情况下通常有用，这就是我的想法。但是由于复杂的原因，我需要对 IE6 做一些事情。我需要更改我的 CSS 和 HTML 结构以适应这个令人讨厌的浏览器的恼人情况之一！ - 无论如何谢谢！

标签： html css internet-explorer-6

【解决方案1】：

元素相对于它的第一个定位（非静态）祖先元素进行定位。绝对位置元素的定位relative 是第一个具有非静态位置的父元素。如果没有找到这样的元素，则包含块是<html>

因此，要使您的内部 div 相对于其父级“绝对”定位，您必须使其父级定位为 relative

jsFiddle showing your code with parent div relative

<div style="background:blue; width:600px; margin-left:auto; margin-right:auto;position:relative">BLUE
    <div style="background:red; position:absolute; width:100%; left:0;">red</div>
</div>

对于您的其他情况（ie6 错误？），我需要更多代码。

【讨论】：

感谢您设置小提琴。 - 下次我会这样做。我了解位置相对的工作原理。在我的情况下，它会从正文中获取它......它适用于除 IE 6 之外的所有浏览器。就好像它总是从它的容器中获取宽度一样。有趣的是，您可以使用 "left:0" 将其定位到主体，但宽度始终在容器上。