css - 为什么在 IE 中嵌套的 Div 从父级出来

Question

抱歉，我没有确切的代码，但希望这能与我提供的示例一起使用。

为什么在 IE 中，一些嵌套的 div 会弹出并位于错误的位置(例如，比它应该在的位置低 200 像素)。

<div style="width:1024px;height:103px;background-color:green;">
    <div style="float:left;width:300px;height:103px;"><img src="LOGO URL"/>
    </div>
    <div style="float:right;width:180px;height:103px;">
    </div>
</div>

有人明白我的意思吗？我很确定它与双边距无关。我还应该费心让网站与 IE7 和 6 兼容吗？

我正在尝试以正确的方式学习 html。我希望能够确保我的代码始终与所有浏览器兼容并且可供残疾人使用。有什么地方可以推荐我学习“正确”的做法吗？我理解大多数 HTML，但兼容性可能存在问题。

Answer 1

它在现代浏览器中是否同样有效？父元素永远不会展开以包含 float 元素。要做你想做的事，你要么需要 float 父级，要么给它一个'overflow:auto'CSS属性。但是将父 div 的高度固定为 103px 仍然会限制一些事情。