0

Why HTML body margin area is filled with the body's background-color which is different behavior than for other elements (e.g. div)? Is this specified somewhere? Below is a simple example.

body {
  background-color: lightgray;
  padding: 0px;
  margin: 50px;
  border: 25px solid black;
}

div {
  margin: 50px;
  padding: 50px;
  border: 25px solid brown;
  background-color: orange;
  background-position: 50px 50px;
}
<div></div>
Gerard
  • 15,418
  • 5
  • 30
  • 52
Jolly Roger
  • 233
  • 2
  • 6
  • 1
    Have a look at [collapsing margins](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing) – Pete Sep 27 '18 at 08:24
  • What colour would you like it to be? You could always add * {background-color: white;} to the top of your css code – CodeBoyCode Sep 27 '18 at 08:27
  • 2
    This is not about collapsing margins, that's a different thing. In my case the coloring happens horizontally too (collapsing margins occurs top/bottom only). – Jolly Roger Sep 27 '18 at 08:28
  • Pretty well explained in the duplicate questions. Thanks @Temani Afif. – Jolly Roger Sep 27 '18 at 08:55
  • https://stackoverflow.com/questions/10947541/applying-a-background-to-html-and-or-body – Jolly Roger Sep 27 '18 at 09:06

0 Answers0