I am admittedly a beginner, but I also did a fair amount of searching before posting this. There seems to be extra space around my div element. I also would like to point out that I tried many combinations of border: 0, padding:0, etc. and nothing seemed to get rid of the white space.
我当然是初学者，但在发布之前我也进行了大量的搜索。我的div元素周围似乎有额外的空间。我还想指出我尝试了很多边框组合：0，填充：0等等，似乎没有任何东西摆脱白色空间。
Here is the code:
这是代码：
<html>
<head>
<style type="text/css">
#header_div {
background: #0A62AA;
height: 64px;
min-width: 500px;
}
#vipcentral_logo { float:left; margin: 0 0 0 0; }
#intel_logo { float:right; margin: 0 0 0 0; }
</style>
</head>
<body>
<div id="header_div">
<img src="header_logo.png" id="vipcentral_logo">
<img src="intel_logo.png" id="intel_logo"/>
</div>
</body>
This is what it looks like (I inserted red arrows to explicitly call out the extra space):
这就是它的样子（我插入红色箭头以显式调出额外的空间）：
I was expecting the blue color to abut directly to the browser edges and toolbar. The images are both exactly 64 pixels tall and have the same background color as the one assigned to #header_div. Any information would be greatly appreciated.
我期待蓝色直接与浏览器边缘和工具栏相邻。这些图像正好是64像素高，并且具有与分配给#header_div的图像相同的背景颜色。任何信息将不胜感激。
7 个解决方案
#1
32
body has default margins: http://www.w3.org/TR/CSS2/sample.html
body有默认边距：http：//www.w3.org/TR/CSS2/sample.html
body { margin:0; } /* Remove body margins */
Or you could use this useful Global reset
或者你可以使用这个有用的全局重置
* { margin:0; padding:0; box-sizing:border-box; }
If you want something less * global than:
如果你想要的东西少于*全球而不是：
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
some other CSS Reset:
其他一些CSS重置：
http://yui.yahooapis.com/3.5.0/build/cssreset/cssreset-min.css
http://meyerweb.com/eric/tools/css/reset/
https://github.com/necolas/normalize.css/
http://html5doctor.com/html-5-reset-stylesheet/
…
http://yui.yahooapis.com/3.5.0/build/cssreset/cssreset-min.css http://meyerweb.com/eric/tools/css/reset/ https://github.com/necolas/normalize .css / http://html5doctor.com/html-5-reset-stylesheet/ ...
#2
7
try removing the padding/margins from the body tag.
尝试从body标签中删除填充/边距。
body{
padding:0px;
margin:0px;
}
#3
3
That's the default margin/padding of the body element.
这是body元素的默认margin / padding。
Some browsers have a default margin, some a default padding, and both are applied as a padding in the body element.
某些浏览器具有默认边距，一些是默认填充，两者都作为填充应用于body元素。
Add this to your CSS:
将其添加到您的CSS：
body { margin: 0; padding: 0; }
#4
3
try to ad the following in your CSS:
尝试在CSS中添加以下内容：
body, html{
padding:0;
margin:0;
}
#5
2
I found this problem continued even when setting the BODY MARGIN to zero.
即使将BODY MARGIN设置为零，我也发现这个问题仍然存在。
However it turns out there is an easy fix. All you need to do is give your HEADER tag a 1px border, aswell as setting the BODY MARGIN to zero, as shown below.
然而事实证明有一个简单的解决方案。您需要做的就是给HEADER标签一个1px的边框，以及将BODY MARGIN设置为零，如下所示。
body { margin:0px; }
header { border:1px black solid; }
If you have any H1, H2, tags within your HEADER you will also need to set the MARGIN for these tags to zero, this will get rid of any extra space which may show up.
如果您的HEADER中有任何H1，H2标签，您还需要将这些标签的MARGIN设置为零，这将消除可能出现的任何额外空间。
Not sure why this works, but I use Chrome browser. Obviously you can also change the colour of the border to match your header colour.
不知道为什么会这样，但我使用的是Chrome浏览器。显然，您还可以更改边框的颜色以匹配标题颜色。
#6
0
Go with this
跟着这个吧
body {
padding:0px;
margin:0px;
}
#7
0
I had the same problem and my first <p> element which was at the top of the page and also had a browser webkit default margin. This was pushing my entire div down which had the same effect you were talking about so watch out for any text-based elements that are at the very top of the page.
我遇到了同样的问题，我的第一个
元素位于页面顶部，并且还有一个浏览器webkit默认边距。这推动了我的整个div，这与你所谈论的效果相同，所以要注意页面顶部的任何基于文本的元素。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My Website</title>
</head>
<body style="margin:0;">
<div id="image" style="background: url(pixabay-cleaning-kids-720.jpg)
no-repeat; width: 100%; background-size: 100%;height:100vh">
<p>Text in Paragraph</p>
</div>
</div>
</body>
</html>
So just remember to check all child elements not only the html and body tags.
因此，请记住检查所有子元素，而不仅仅是html和body标签。
#1
32
body has default margins: http://www.w3.org/TR/CSS2/sample.html
body有默认边距：http：//www.w3.org/TR/CSS2/sample.html
body { margin:0; } /* Remove body margins */
Or you could use this useful Global reset
或者你可以使用这个有用的全局重置
* { margin:0; padding:0; box-sizing:border-box; }
If you want something less * global than:
如果你想要的东西少于*全球而不是：
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
some other CSS Reset:
其他一些CSS重置：
http://yui.yahooapis.com/3.5.0/build/cssreset/cssreset-min.css
http://meyerweb.com/eric/tools/css/reset/
https://github.com/necolas/normalize.css/
http://html5doctor.com/html-5-reset-stylesheet/
…
http://yui.yahooapis.com/3.5.0/build/cssreset/cssreset-min.css http://meyerweb.com/eric/tools/css/reset/ https://github.com/necolas/normalize .css / http://html5doctor.com/html-5-reset-stylesheet/ ...
#2
7
try removing the padding/margins from the body tag.
尝试从body标签中删除填充/边距。
body{
padding:0px;
margin:0px;
}
#3
3
That's the default margin/padding of the body element.
这是body元素的默认margin / padding。
Some browsers have a default margin, some a default padding, and both are applied as a padding in the body element.
某些浏览器具有默认边距，一些是默认填充，两者都作为填充应用于body元素。
Add this to your CSS:
将其添加到您的CSS：
body { margin: 0; padding: 0; }
#4
3
try to ad the following in your CSS:
尝试在CSS中添加以下内容：
body, html{
padding:0;
margin:0;
}
#5
2
I found this problem continued even when setting the BODY MARGIN to zero.
即使将BODY MARGIN设置为零，我也发现这个问题仍然存在。
However it turns out there is an easy fix. All you need to do is give your HEADER tag a 1px border, aswell as setting the BODY MARGIN to zero, as shown below.
然而事实证明有一个简单的解决方案。您需要做的就是给HEADER标签一个1px的边框，以及将BODY MARGIN设置为零，如下所示。
body { margin:0px; }
header { border:1px black solid; }
If you have any H1, H2, tags within your HEADER you will also need to set the MARGIN for these tags to zero, this will get rid of any extra space which may show up.
如果您的HEADER中有任何H1，H2标签，您还需要将这些标签的MARGIN设置为零，这将消除可能出现的任何额外空间。
Not sure why this works, but I use Chrome browser. Obviously you can also change the colour of the border to match your header colour.
不知道为什么会这样，但我使用的是Chrome浏览器。显然，您还可以更改边框的颜色以匹配标题颜色。
#6
0
Go with this
跟着这个吧
body {
padding:0px;
margin:0px;
}
#7
0
I had the same problem and my first <p> element which was at the top of the page and also had a browser webkit default margin. This was pushing my entire div down which had the same effect you were talking about so watch out for any text-based elements that are at the very top of the page.
我遇到了同样的问题，我的第一个
元素位于页面顶部，并且还有一个浏览器webkit默认边距。这推动了我的整个div，这与你所谈论的效果相同，所以要注意页面顶部的任何基于文本的元素。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My Website</title>
</head>
<body style="margin:0;">
<div id="image" style="background: url(pixabay-cleaning-kids-720.jpg)
no-repeat; width: 100%; background-size: 100%;height:100vh">
<p>Text in Paragraph</p>
</div>
</div>
</body>
</html>
So just remember to check all child elements not only the html and body tags.
因此，请记住检查所有子元素，而不仅仅是html和body标签。