Html ie和chrome的风格差异？_Html_Css

Html ie和chrome的风格差异？

html css

Html ie和chrome的风格差异？,html,css,Html,Css,这是我的代码： <!DOCTYPE> <html> <body> <div class="main"> <div id="div1" style="float: left;height: 200px;border:1px solid red; ">1</div> <div style="clear:both"></div> <div id="div2" style=

这是我的代码：

<!DOCTYPE>
<html>
<body>
  <div class="main">
    <div id="div1" style="float: left;height: 200px;border:1px solid red; ">1</div> 
    <div style="clear:both"></div>
    <div id="div2" style="border:1px solid red;margin-top:20px;background-color: #FFF; ">2</div> 
  </div> 
</body>
</html>


1.
2.

在浏览器中

页边距顶部

被启用，div1和div2相隔20px；

但是在IE8中，div1和div2总是保持在一起。

你也可以在第二个div中浮动：left

通过在第二个div中添加div，可以禁用浮动div检查的各个方面

HTML:


1.
2.

确认IE是以怪癖模式还是兼容模式加载页面。这可能会导致这样的布局差异。在IE中按F12以获取开发工具，该工具将告诉您浏览器模式。如果在错误的模式下，其他地方有很多答案，这将有所帮助。你添加了吗？@Mr.Alien-Quirks模式改变了利润率的工作方式，因此考虑到这个问题是关于利润率的，它可能是相关的。然而，很难给出更好的建议，因为问题没有包含足够的细节来正确诊断或复制问题。@Spudley是的，除非提供更多细节，否则这个问题无法回答

<div class="main">
    <div id="div1" style="float: left;height: 200px;border:1px solid red; ">1</div> 
    <div style="float:left; clear:both"></div>
    <div id="div2" style="margin-top:20px; float:left; width:100%;"><div style="border:1px solid red;background-color: #FFF;">2</div></div> 
</div>