Css IE7不能很好地使用我的浮动边栏

我试图让一个动态大小的边栏浮动在我的网页的右上角（但在标题和导航下方），并让页面上的主要内容围绕它流动（有点像“L”形状，除了“L”的底部非常厚）。边栏的宽度和高度会因页面而异，所以我不能使用任何硬值

我的css看起来像：

#main {
    width: 850px;
    height: auto;
}

#sidebar {
    width: auto;
    float: right;
}

<div id="wrapper">  
    <div id="header">    /* header stuff */    </div>  
    <div id="nav">       /* nav stuff */       </div>  

    <div id="sidebar">  
        /* my sidebar content, really just an h3 and a ul */
    </div>

    <div id="main">
        /* lots of content here */
    </div>
</div>

（加上一些我认为无关紧要的填充、边距和背景色代码）

我的html看起来像：

#main {
    width: 850px;
    height: auto;
}

#sidebar {
    width: auto;
    float: right;
}

<div id="wrapper">  
    <div id="header">    /* header stuff */    </div>  
    <div id="nav">       /* nav stuff */       </div>  

    <div id="sidebar">  
        /* my sidebar content, really just an h3 and a ul */
    </div>

    <div id="main">
        /* lots of content here */
    </div>
</div>

/*标题填充*/
/*导航设备*/
/*我的侧边栏内容，实际上只是一个h3和一个ul*/
/*这里有很多内容*/

我不完全理解为什么我必须首先使用侧边栏div，但它可以在FF、Chrome、Safari（Windows）和IE8中很好地使用这段代码。但在IE7（和IE6，我不关心）上，主要内容被压到侧边栏底部下方，就好像侧边栏div上有一个“clear:left”（但没有）

我有一种感觉，这是IE7不合规的错误之一，特别是因为IE8的行为与其他浏览器一模一样。但我不知道如何修复它

---

有什么想法吗？TIA。

从您描述的内容来看，侧边栏的行为似乎是一个块元素。也许可以尝试一些不同的显示选项，如内联块。我还尝试尝试使用“宽度-最小宽度”属性。不过很难说。

首先，确保您使用的doctype将IE7置于严格模式（请参阅以获取解释）。如果这还不行，那可能是你需要在你的边距宽度上做一些调整

之所以必须首先使用边栏div，是因为div是一个显示为块元素的元素，它后面的任何内容都将在它下面（除非浮动主div）

---

通过浮动边栏div并将其放在第一位，浏览器知道它可以在边栏右侧显示主div。您可以通过将float left添加到主div并从侧边栏div中删除float并将其移动到主div之后来获得类似的效果。

宾果！固定的！那些提到用宽度和边距打球的家伙今晚将获得金星奖。事实证明，我所要做的就是删除主div上的固定宽度，然后在右侧添加一些填充，为文本和图像创建一个边沟。在FF3、Chrome、Safari（Win）以及最重要的IE6和IE7中进行了测试和确认（尽管我仍然讨厌IE）

我猜IE渲染引擎是在说，“我知道你希望你的主div是850px宽，但是你的侧边栏被卡住了，我没有空间，所以我不得不把它推到侧边栏下面。”。当然，其他浏览器的渲染引擎都会说，“老兄，我完全明白你想做的事！没问题，我会按照你的意愿来安排一切。”

My doctype:谢谢你对div排序的解释。