Div"默认利润"无处不在

即使经过我用css和html编写的许多行之后,css行为仍然让我感到惊讶 - 这是一种糟糕的方式.

我正在为一个朋友组建一个示例网站,向他展示如何构建他的布局,但Firefox 3.0.5和IE8在我的#header,#content和#footer-div之间创造了边缘.如果我在IE7模式下切换,边距消失.

CSS:

html, body {
   background-color: #fff;
   margin: 0;
   padding: 0;
   width: 100%;
}

#page {
   background-image: url('bg_gradiant.png');
   background-repeat: repeat-y;
   width: 950px; /* 770px + 2 * 90px; */
   margin: 0 auto;
   padding-left: 90px;
}

#header {
   width: 770px;
   margin: 0;
   padding: 0;
}

#header #row1 {
   background-color: #9ab3ba;
   height: 50px;
}
#header #row2 {
   background-color: #517279;
   height: 50px;
}

#content {
   width: 770px;
   background-color: #d7e9ed;
}

#footer {
   background-color: #5eb6cc;
   width: 770px;
   height: 150px;
}

HTML:

    
    
    
    



   

      

      

   
   

      
Beware of the Content
   
   

   

您可以在此处查看此页面:https://codepen.io/lx-s/pen/eRrOpL

浏览IE Developer Tools和Firebug告诉我他们没有为这些div设置默认边距值,但正如人们所看到的,他们就在那里.希望你能给我一个如何摆脱它们的暗示 - 它让我疯狂.

提前致谢!

将以下内容添加到样式表中:

* {
    margin: 0;
}